列表List
无序列表:
<ul>
<li>第一行</li>
<li>第二行</li>
<li>第三行</li>
</ul>
有序列表:(type是指定顺序的表现形式,如为a,则内容按abc排序,如为1,则内容按123排序)
<ol type="...">
<li>第一行</li>
<li>第二行</li>
<li>第三行</li>
</ol>
在列表的每一行里面再嵌入一个列表也完全可以!如
<ul>
<li>第1行
<ul>
<li>第1.1行</li>
<li>第1.2行</li>
<li>第1.3行</li>
</ul>
</li>
<li>第2行</li>
<li>第3行</li>
</ul>
表格Table
大家冰雪聪明,看代码就懂了:
<table>
<caption>基本表格</caption>
<tr>
<th>num1</th>
<th>num2</th>
<th>num3</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
如果想要删掉5而不改变布局,可以让4跨两列。也可以<td></td>里面什么都不输入。
<td colspan="2">4</td>
要想给表格加上边框或进一步美化它,就要去学学css的知识啦,可以去康康我的css文章哦。
输入input
<input>是个双标签
<input type="text" placeholder="请输入您的账号"/><br>
<input type="password" placeholder="请输入您的密码"/><br>
<input type="submit"/>
这个页面是不是很熟悉哈哈,短短三行代码就能实现,还可以加入value="…"定义输入的默认内容。
type定义输入的属性,text就是普通文本;password就是密码,输入时不明文显示;submit就是提交数据咯。还有很多type属性,如file、radio、range等,大家去试试吧
文本框textarea
<textarea row="10" cols="30"></textarea>
容器
这是个很重要的内容,如果大家已经用到容器知识,说明已经进入进阶学习了,html里有线型区域<span>和块型区域<div>,尤其是<div>,随便打开一个网页,按F12然后选elemen元素,你会看到一大堆的<div>,因为它可以很方便地进行网页布局。
在body里面输入下面的代码,你就能理解容器:
<span>行区域1</span>
<span>行区域2</span>
<span>行区域3</span>
<div>
块区域1
</div>
<div>
块区域2
</div>
<div>
块区域3
</div>
相信不用我多说大家现在能明白块和行的区别了,那么它既然是容器,就能装下很多东西,之前介绍的<h1><p><img><video><table>等等都能装在一个容器里,而且他们之间能相互嵌套,div里嵌个span再嵌个div也完全ok,然后给容器加个类class="…",我们就可以很方便地在css文件里对其进行编辑,同时整个页面的布局也可以随心所欲。