HTML
<!DOCTYPE html>
<!-- 文档类型声明标签-当前网页使用的是html5 版本来显示网页-->
<html lang="zh-CN--">
<!-- 当前文档的显示语言 zh-CN-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* 选择器{样式} */
p {
color: brown;
}
</style>
</head>
<body>
<h1>一级标题</h1>
<h2>二级标题</h2>
<!-- 标题独占一行，且加粗加大 -->
<p>cssPeek.peekToExclude - A list of file globs that filters out style files to not look for. <br />By default,
node_modules and bower_components</p>
<!-- <p></p>段落标签，强制换行，段落与段落之间会加入垂直距离 -->
<!-- <br />强制换行，只是单纯换行，不会有缝隙 -->
<!-- 文本格式化标签 -->
我是<strong>加粗</strong>
我是<b>加粗</b>
我是<em>倾斜</em>
我是<i>倾斜</i>
我是<del>删除</del>
我是<s>删除</s>
我是<ins>下划线</ins>
我是<u>下划线</u>
<!-- <div> 和 <span> -->
<div>我是一个div标签，我独占一行</div>
<!-- 分割、分区。一行只能放一个div大盒子 -->
<span>百度</span>
<span>搜狐</span>
<span>谷歌</span>
<!-- 跨度、跨距。一行可以放多个span -->
<a href="#back">
<h4 id="moon">我的锚点链接的测试点，还可以再回去</h4>
</a>
<!-- 图像标签 -->
<img src="img/rabbit.png">
<!-- 单标签。src是<img>标签的必须属性，用于指定图像文件的路径和文件名 -->
<img src="img/earth1.jpg" alt="图片无法显示">
<!-- 单标签。alt,替换文本，用于图像文件无法显示时，所显示的文字 -->
<img src="img/rabbit.png" title="人类共同体">
<!-- 单标签。title,提示文本，当鼠标放在图片上时，所显示的文字 -->
<img src="img/rabbit.png" width="500">
<!-- 单标签。width, 宽度，只备注一个会自动调节比例 -->
<img src="img/rabbit.png" width="500" height="100">
<!-- 单标签。height, 高度，同时备注两个会失真 ，一般只调节一个-->
<img src="img/rabbit.png" border="15">
<!-- 单标签。border可以给图像设定边框-->
<!--
图像路径-相对路径
相对路径-图片相当于当前html页面的位置
同一级 直接
下一级 <img src="img/earth.jpg" alt="">
上一级 <img src="../img/earth.jpg" alt=""> 可以../../上两级
-->
<!--
图像路径-绝对路径
绝对路径-目录下的绝对位置。盘符下或者网址。
-->
<!-- 超链接标签 -->
<a href="https://www.bilibili.com/video/BV14J4114768?p=26">黑马pink老师</a><br />
<!-- href必须属性。 -->
<a href="https://www.bilibili.com/video/BV14J4114768?p=26" target="_self">黑马pink老师</a><br />
<!-- target属性。原窗口打开界面 -->
<a href="https://www.bilibili.com/video/BV14J4114768?p=26" target="_blank">黑马pink老师</a><br />
<!-- target属性。新窗口打开界面 -->
<!--
链接类型
外部链接-网址http
内部链接-同一级，直接写就可以
-->
<!-- 空链接-# -->
<a href="#">黑马空链接</a><br />
<!-- 下载链接-文件或者压缩包 -->
<a href="img.zip">黑马下载链接</a><br />
<!-- 网页元素链接- -->
<a href="https://www.baidu.com/"><img src="img/rabbit.png"></a><br />
<!-- 锚点链接-快速定位到页面的某个位置 -->
<a href="#moon" id="back">锚点链接</a><br />
<!-- 特殊字符 -->
前 端
<!-- 表格标签 -->
<!-- 用于显示、展示数据（不是用来展示页面） -->
<table>
<tr>
<td>我是一个表格</td>
</tr>
</table>
<!-- table 用于定义表格的标签 -->
<!-- tr 定义表格中的行 -->
<!-- td 定义表格中的单元格(注意是单元格，不是列哦) -->
<table>
<tr>
<td>车号</td>
<td>趟次</td>
<td>间隔</td>
</tr>
<tr>
<td>1</td>
<td>趟次</td>
<td>5</td>
</tr>
<tr>
<td>2</td>
<td>趟次</td>
<td>6</td>
</tr>
<tr>
<td>3</td>
<td>趟次</td>
<td>7</td>
</tr>
<tr>
<td>4</td>
<td>趟次</td>
<td>8</td>
</tr>
</table>
<!-- 表头单元格标签 -->
<!-- 表头单元格里的内容会加粗居中显示 -->
<!-- th -->
<table>
<tr>
<th>车号</th>
<th>趟次</th>
<th>间隔</th>
</tr>
<tr>
<td>1</td>
<td>趟次</td>
<td>5</td>
</tr>
<tr>
<td>2</td>
<td>趟次</td>
<td>6</td>
</tr>
<tr>
<td>3</td>
<td>趟次</td>
<td>7</td>
</tr>
<tr>
<td>4</td>
<td>趟次</td>
<td>8</td>
</tr>
</table>
<!-- 表格属性-一般不常用，通过css -->
<!-- cellpadding：文字与边框距离 -->
<!-- cellspacing：单元格与单元格距离 -->
<table align="center" border="1" cellpadding="20" cellspacing="0">
<tr>
<th>车号</th>
<th>趟次</th>
<th>间隔</th>
</tr>
<tr>
<td>1</td>
<td>趟次</td>
<td>5</td>
</tr>
<tr>
<td>2</td>
<td>趟次</td>
<td>6</td>
</tr>
<tr>
<td>3</td>
<td>趟次</td>
<td>7</td>
</tr>
<tr>
<td>4</td>
<td>趟次</td>
<td>8</td>
</tr>
</table>
<!-- 案例 -->
<table align="center" width="500" height="249" border="1" cellspacing="0">
<tr>
<th>排名</th>
<th>关键词</th>
<th>趋势</th>
<th>今日搜索</th>
<th>最近七日</th>
<th>相关链接</th>
</tr>
<tr>
<td>1</td>
<td>鬼吹灯</td>
<td>↑</td>
<td>345</td>
<td>123</td>
<td><a href="#">贴吧</a> <a href="#">图片</a> <a href="#">百科</a></td>
</tr>
<tr>
<td>2</td>
<td>盗墓笔记</td>
<td></td>
<td>345</td>
<td>123</td>
<td><a href="">贴吧</a> <a href="">图片</a> <a href="">百科</a></td>
</tr>
<tr>
<td>3</td>
<td>西游记</td>
<td></td>
<td>345</td>
<td>
最低0.47元/天 解锁文章
104
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
