HTML知识框架 二

81 阅读2分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第20天,点击查看活动详情 >>

HTML知识框架

标签

列表标签

  • 无序列表 ul
```html
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
......
</ul>
  • 有序列表 ol
```html
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
......
</ol>

注意:

1. <ul></ul>中只能嵌套<li></li>,直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
2. <li>与</li>之间相当于一个容器,可以容纳所有元素。
3. 无序列表会带有自己样式属性,放下那个样式,一会让CSS来!

自定义列表

```html
<dl>
<dt>名词1</dt>
<dd>名词1解释1</dd>
<dd>名词1解释2</dd>

表格

表格结构

  1. table用于定义一个表格
  2. tr 用于定义表格中的一行,必须嵌套在 table标签中,在 table中包含几对 tr,就有几行表格。
  3. td /td:用于定义表格中的单元格,必须嵌套在标签中,一对 中包含几对,就表示该行中有多少列(或多少个单 元格)。
html
<table>
<tr>
<td>单元格内的文字</td>
...
</tr>
...
</table>

表头标签

表格的标题:<caption>

合并单元格

  1. 跨行合并:rowspan
  2. 跨列合并:colspan
  3. 合并的顺序 先上 先左

总结

  1. 表格提供了HTML 中定义表格式数据的方法。
  2. 表格中由行中的单元格组成。
  3. 表格中没有列元素,列的个数取决于行的单元格个数。
  4. 表格不要纠结于外观,那是CSS 的作用。

html骨架

  1. HTML标签:作用所有HTML中标签的一个根节点
  2. link head标签作用:用于存放title,meta,base,style,script,
  3. title标签:让页面拥有一个属于自己的标题。
  4. .body标签:页面在的主体部分,用于存放所有的HTML标签: p,h,a,b,u,i,s,em,del,ins,strong,img
html
<HTML>
<head>
<title></title>
</head>数字值的输入字段
</body>
</HTML>

HTML 表单

文本输入:

  1. text 定义常规文本输入
  2. number数字值的输入字段
  3. radio 定义单选按钮输入(选择多个选择之一)
  4. submit 定义提交按钮(提交表单)
    文本输出:password   
      单选按钮输:定义单选按钮。