- 1、粗体:
html
<strong>粗体</strong>
- 2、斜体
html
<em>斜体</em>
- 3、特殊符号:
HTML特殊字符符号大全(查看更多)
- 4、锚链接
html
<a id="top"></a>
...
<!--点击这个a标签就会回到上面那个a标签-->
<a href="#top"></a>
...
...
<!--点击这个a标签就会回到上面那个HelloWOrld.html那个网页的a标签-->
<a href="HelloWorld.html#top"></a>
- 5、功能性链接
html
<!--点击这个a标签就会打开邮箱-->
<a href="mailto:1520394133@qq.com"></a>
例子:qq推广链接 https://shang.qq.com/v3/widget.html
html
<!--qq推广链接-->
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2::51" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>
注:51标准型,52简洁型,53扩展型
- 6、行内元素
html
<a></a>
<strong></strong>
<em></em>
- 7、块元素
html
<p></p>
<h1></h1>
...
<h6></h6>
- 8、有序列表
html
<ol>
<li>1</li>
<li>2</li>
<li>3</li>
</ol>
- 9、无序列表
html
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
- 10、自定义列表
html
<dl>
<dt>课程</dt>
<dd>语文</dd>
<dd>数学</dd>
<dd>英语</dd>
<dt>老师</dt>
<dd>王老师</dd>
<dd>张老师</dd>
<dd>刘老师</dd>
</dl>
- 11、表格
html
<table>
<tr>
<!--跨列,横地占-->
<td colspan="4">1-1</td>
<td>1-2</td>
<td>1-3</td>
</tr>
<tr>
<!--跨行,竖地占-->
<td rowspan=“2”>2-1</td>
<td>2-2</td>
<td>2-3</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
<td>3-3</td>
</tr>
</table>
- 12、视频
html
<!--
controls:控制跳
autoplay:自动播放
-->
<vedio src="" controls autoplay></vedio>
<audio src="" controls autoplay></audio>
- 13、页面结构分析
14、iframe(内联框架)
html
<iframe src="" name="MyFrame"></iframe>
<!--点击这个a标签可以将a标签中的地址显示到上面这个iframe中-->
<a href="https://www.baidu.com" target="MyFrame"></a>
html
<!--哔哩哔哩的内联框架,可以试试-->
<iframe src="//player.bilibili.com/player.html?aid=55631961&bvid=BV1x4411V75C&cid=97257967&page=11" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
- 15、表单的提交方式:
get:不安全,但是高效
post:安全,可以传输大文件
表单的属性
- 16、一组单选框(type="radio")要指定name属性的值相同(组名)
- 17、一组多选框(type="checkbox")“最好”指定name的属性值相同
- 18、表单中的四种按钮
- 19、下拉框
其中,select标签的“name属性值”和option标签的“value属性值”将分别作为表单提交的“键”和“值”
- 20、其他表单type属性
21、label标签,单击label标签内的文字,就可以编辑与for属性与id属性值相同的input标签,如此一来就可以增强鼠标可用性
22、pattern属性,利用正则表达式自定义格式
html
<input type="text" pattern="这里输入正则表达式"/>