A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

1、基础班第一天html
1.1、Web标准(重点)
Web标准不是某一个标准,而是由W3C组织和其他标准化组织制定的一系列标准的集合。
由于各个浏览器的内核不同,所以我们要遵循W3C组织制定的web标准让所有浏览器最终显示的效果完全一致‘’
01Web 标准构成
构成: 主要包括结构(Structure)、表现(Presentation)和行为(Behavior)三个方面。
结构标准HTML:页面的基本结构的搭建;
表现标准CSS:页面的样式美化
行为标准javascript:实现页面的交互
1.2、html的基本结构
一对html标签嵌套一对head标签和body标签,head标签嵌套一对title标签,head是给浏览器看的,body是给用户看的;
<html>
     <head>
                <title>标题</tilte>
     </head>
     <body>
              网页主体内容
     </body>
</html>
1.3、HTML常用标签
标题标签h 段落标签p水平线标签hr ,div 和 span标签,换行标签br  链接标签a

2、基础班第2天html

2.1/表格 table
01 表格的主要目的是用来显示特殊数据的
02、一个完整的表格有表格标签(table),行标签(tr),单元格标签(td)组成,没有列的标签
03、<tr></tr>中只能嵌套<td></td> 类的单元格
04、<td></td>标签,他就像一个容器,可以容纳所有的元素
2.2、无序列表 ul

     1. <ul></ul>中只能嵌套<li></li>,直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
       2. <li>与</li>之间相当于一个容器,可以容纳所有元素。

2.3、有序列表 ol
2.4、自定义列表 dl
2.5、 表单标签
表单作用:表单目的是为了收集用户信息。
表单控件: 包含了具体的表单功能项,如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。
提示信息: 一个表单中通常还需要包含一些说明性的文字,提示用户进行填写和操作。
file:///C:/Users/Romal/AppData/Local/Temp/msohtmlclip1/01/clip_image001.png表单域: 他相当于一个容器,用来容纳所有的表单控件和提示信息,可以通过他定义处理表单数据所用程序的url地址,以及数据提交到服务器的方法。如果不定义表单域,表单中的数据就无法传送到后台服务器。
3、基础班第3天css
1、   CSS的作用:设置网页的样式,美化页面
2、  CSS按照放置的位置可以分为三类:行内样式、内部样式(内联样式)、外部样式
01行内样式:直接将css样式写在标签里<div style=“color: skyblue; ”>龙马,最棒</div>
    02 内部样式:将css写在head标签里<style> div { color: skybllue ;} </style>
    03 外部样式:直接重新建一个.css文件,然后在html文件里调用这个.css文件
       调用方法:在head里写上link标签 <link rel=”” type=”” href=”.css文件路径”/>
行内样式没有实现结构与样式分离,内部样式实现了半分离,外部样式实现了完全分离
3、  CSS的选择器:分为两大类:基础选择器和 复合选择器
基础选择器:标签选择器、类选择器、id选择器、通配符选择器
01、   标签选择器:div { color: skyblue ; }
02、  类选择器:
首先用 . 定义类名称 .skyblue{ color: skyblue; }
然后哪里需要设置样式就在哪里用class来调用 <div class=”skyblue” ></div>
3、基础班第4天css
3.1、 CSS复合选择器
01、 后代选择器(重点)
特点:html布局有嵌套关系
概念:后代选择器又称为包含选择器
作用:用来选择元素或元素组的子孙后代
02、 子元素选择器
只能选择嵌套关系的父子关系得到元素,也就是嵌套的第一层元素,一个大于号“>”表示选中子级;
03、 交集选择器
直接在标签选择器后面紧跟着书写类选择器或者id选择器即可;

在一堆标签里面单独指定和其他标签样式不一致的方法;
04、 并集选择器(重点)
并集选择器(CSS选择器分组)是各个选择器通过 , 连接而成的,通常用于集体声明。
3.2、CSS 三大特性
CSS层叠性 CSS继承性 CSS优先级(重点3.3、标签显示模式(display
行内元素的特点:(重点)
1)相邻行内元素在一行上,一行可以显示多个。
2)高、宽直接设置是无效的。
3)默认宽度就是它本身内容的宽度。
4行内元素只能容纳文本或则其他行内元素。
块级元素的特点(重点)
(1)比较霸道,自己独占一行
(2)高度,宽度、外边距以及内边距都可以控制。
(3)宽度默认是容器(父级宽度)的100%

(4)是一个容器及盒子,里面可以放行内或者块级元素。
行内块元素的特点:(重点)
1)和相邻行内元素(行内块)在一行上,但是之间会有空白缝隙。一行可以显示多个
2)默认宽度就是它本身内容的宽度。
3)高度,行高、外边距以及内边距都可以控制。
4、基础班第4天css
盒子模型(Box Model)(重点)
所谓盒子模型:就是把HTML页面中的布局元素看作是一个矩形的盒子,也就是一个盛装内容的容器。
组成
内容:实体化宽高
边框:border
内边距:padding   拉开内容到盒子边缘的距离;(类似单元格的 cellpadding)

外边距:margin    拉开盒子与盒子之间的距离;(类似单元格的 cellspacing)
5、基础班第5天css
5.1、浮动:让盒子从普通流中浮起来,让多个块级盒子一行显示;
浮动的特点
01 浮:让盒子脱离原来的文档流,漂浮起来;
02漏:盒子浮动之后脱离的标准流原来的位置就空了,下面的盒子会补上来;
03特:a、任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。
/5.2、清除浮动的方法
额外标签法(隔墙法)  使用after伪元素清除浮动   使用双伪元素清除浮动 父级添加overflow属性方法
6、定位详解
定位也是用来布局的,它有两部分组成:定位 = 定位模式 + 边偏移
相对定位(relative) 静态定位(static)
绝对定位(absolute) 固定定位[size=18.6667px](fixed)


0 个回复

您需要登录后才可以回帖 登录 | 加入黑马