目录
1.html简介
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言,而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
2.元素
元素=标签+属性+内容
布局:static,静态流式布局。
(1)块元素、行元素、行内块元素
块元素:独占一行,可以设置宽高。标签:div,p,h1—h6。
如果不设置宽高,宽度就继承父元素的宽度,高度是0。如果有内容,高度就是内容的高度。
行元素:不能设置宽高,宽高取决于元素本身的内容。
多个元素占用一行,到最后会自动换行。标签:a,b。
行内块元素:既有行元素的特性,也有块元素的特性。标签:bottom,img,input。
可以为元素设置宽高,不独占一行,多个行内块会左右排列。
3.元素定位方式
- (1)默认定位:position:static,采用流式布局,不能通过top等样式来设置位置。
- (2)相对定位:position:relative,元素还在流式文档中,通过top等属性进行样式的微调。
一般情况下,如果是父子元素中,父元素中可以设置相对定位。
- (3)绝对定位:position:absolute,元素脱离文档流,不在参与父元素的流式布局,不在撑开父元素。
Absolute在定位置后,不使用left等值设置时,元素会跑到原有的位置上,开发中不能这样做。
absolute相对于离自己最近的position为非static的祖先元素进行定位。
- (4)固定定位:position:fixed,脱离文档流。当对于根标签进行定位时,页面滚动时不随着页面的滚动而滚动。
4.列表
- (1)列表:1.有序列表(OL),2.无序列表(ul)
- (2)列表项:li
①list-style:none删除列表项的前缀。
- (3)定义列表:dl
<dl>
<!-- 描述项目中的标题 -->
<dt>html</dt>
<!-- 具体内容 -->
<dd>当今最流行的前端语言之一</dd>
</dl>//reversed有序列表逆序排列
5.伪类和伪元素
- (1)伪类:通过一定的条件才会触发的样式。
hover:当鼠标指针放到元素上悬停时触发
focus:当元素成为焦点时触发
visited:A标签专属的伪类,表示访问过的网址
#link:hover {}
6.表格
- (1)Table标签:块元素,显示一个表格。
- (2)Thead标签:表头部,显示表的头部数据。
①Tr标签:代表一行。
②Th标签:代表表头中的一个单元格。
- (3)Tbody标签:表主体
行合并:rowspan
<td rowspan="2">张三</td>当前td所占的行高是两行的高度
列合并:colspan
<td colspan="2">25</td>表示当前单元格要占用两列的宽度
7.Html语义化标签
- ①text-decoration:line-through;添加横向的线段。
- ②header标签表示头部内容,
- ③footer表示页面尾部内容;
- ④nav可以设置导航菜单。
8.B标签和strong标签的区别?
b标签可以实现文本加粗,内容不进行强调;strong也可以实现文本加粗,还有强调的语义。
9.S标签和del标签
s标签会让文本有一个删除线的效果,del具有删除的语义。
10.Css选择器
 中文全角空格 英文空格 中文空格