关于html标签的一些知识

学习html标签总结：

重要知识点：

1.文本级别的标签常用有：

p（段落),span（小区域）.img.表单元，a标签（anchor，锚）Select（选择）, option（选项），input(输入)

2.容器级别的标签常用的有：

div(分区域), h1（标题）,dl（定义列表）,dt（术语）,dd（术语解释）,ul（无序） ,ol（有序） ,li（列表项 ）.form（表单），

（容器级别里面可以套嵌任何文本级别和容器级别的标签）

3.图片：

Img标签（图片显示）所含有的属性有

Src（路径），Width，Height，Title（标题），Border（边框），Alt。

 

4.超链接：

 

a标签（超链接）所含有的属性有：Href（路径），Title（文字显示）。id（设置一个锚，点击后可以跳转到锚所在地）。

 

5.列表：

无序：ul，li。   有序：ol，li。定义：dl，dt，dd。

Ol标签内部只能嵌套li标签，li标签不能脱离ol标签单独使用。

Ul标签内部只能嵌套li标签，li标签不能脱离ul标签单独使用。

dl标签需要嵌套dt标签和dd标签一起使用。而dt标签和dd标签是属于兄弟级别的关系。dl标签中可以有多组dt标签和dd标签。Dt标签后可以有多个dd标签'。

Dl：definition list (定义列表) ，相当于列表最外层的容器，大结构。

Dt：definition term ，表示的是列表的主题或者术语。

Dd：definition description ，表示对于主题或者术语的解释。

 

6.布局：div, span

Div：division（区域，跨度，分割），创建一个布局区域

Span:小区域，小跨度。调整区域中某些文字的大小，或者颜色。

（这里需要用到样式style）

 

7.表格：table, tr(行), td（列）, th（列）。

table嵌套tr嵌套td

Table：table（表格）本身含义就是表格，该标签可以理解为表格最外层的框架。显示外框架可以用

border="1px" style="border-collapse: collapse;"

Tr：table rows，表格的行。定义是表格的内部行

Td：tabe dook，表格单元格。定义的是每一行中的单元格。

Th：table head 表头单元格。可替换td位置。显示出来的字体为粗体。

 

 

8.表单元素：

Form，（表单），创建一个表单环境。所有表单标签只能套嵌在里面。

form的属性：method(方法)，action设置收集到的表单的数据提交给谁的路径

Method:  get方式 和 post方式

 

 

Input：含义为输入。单标签。为表单标签。

Input的属性：

type（可以根据type属性值不同，去创建不同类型的表单元素。）

value（可以设置文本框默认数值。属性值可以是自定义内容。）

 

Type的属性值：

text(文本框),   passdword(密码框),

 

radio(单选按钮),

单选框一般都是成组出现的，多个选项之间是互斥的。

设置单选按钮互斥的方法：同时给这组单选按钮添加一个name的属性，且属性值必须一样。

checkbox(复选按钮), 如果单选按钮或者是复选按钮，想默认被选中的状态，可以给这个表单元素设置一个checked属性

button：（按钮）普通按钮

Reset：（重置）重置按钮，单击按钮后，form标签内部的全部表单元素恢复到起始的状态。

Submit:(提交)提交按钮，当单击这个按钮的时候，可以将form标签内部收集到表单元素数据提交给服务器。而且form标签内部的全部表单元素恢复到起始状态。

 

（这三个按钮都可以通过value属性去设置他们的标题）

 

9.文本域

标签名：textarea（文本域）

Textarea的属性：

Rows:(多行)  Cols:(多列)

Rows:(多行) 它主要的作用是可以设置文本域显示文字用几行来表示，这个属性值用的是数字。

文字超出会有滚动条出现。

Cols:(多列)它的主要作用是，设置文本宽度，

它的属性值是一个数字，数字越大，越宽，否则越小。

 

10.下拉菜单：

selectt（选择）

option（选项）

他们两者都是双标签，都属于文本级标签。

 

关系selectt（选择）嵌套option（选项）

文字写在option中间。

如果想要让某一项作为默认选项显示，需要给这个option标签添加一个selected属性，属性值为selected。