a标签
HTML
<a>元素(或称锚元素)可以创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接。
<body>
<div>
<h1>我是a标签</h1>
<a href="//baidu.com">点击访问百度</a>
<a href="/a/a.html">链接a.html</a>
<a href="javascript:alert(1)" ;>点击我有惊喜</a>
<a href="mailto:renshisan@qq.com">发邮件给荏狸十三</a>
<a href="https://google.com" target="_top">google</a>
<div>
<iframe src="/a/a.html" frameborder="0"></iframe>
</div>
</div>
</body>
属性
href //超级链接,链接到一个地址
target //新窗口打开超级链接。
Img标签
HTML的 lmg标签主要是插入一张图片。作用是发出一股get请求,展示一张图片。
<div>
<img id=xxx width="200" src="qianduan.png" alt="前端图片">
<script>
xxx.onload = function () {
console.log("图片加载成功");
}
xxx.onerror = function () {
console.log("图片加载失败");
xxx.src = "/404.png";
};
</script>
</div>
属性:
alt//裂图或者图片加载失败则会显示alt里面的文字内容。
height //高度。
width //宽度,所有的图片最大化100%有利于手机之间的预览。
src //图片加载失败的时候进行挽救,当判断到图片加载失败的时候则运行“src”语句调用404替换图片。
Onload //加载成功则调用Onload的代码
Onerror //加载失败则调用Onerror的代码
table标签属性
HTML的 table元素表示表格数据 — 即通过二维数据表表示的信息。表格标签,table标签里面只能有三个标签,是一个块级容器标签。所有的表格内容都要放在这个标签里面。
<div>
<h1>对比参数</h1>
<table>
<thead>
<th></th>
<th>美女A</th>
<th>美女B</th>
<th>美女C</th>
</thead>
<tbody>
<tr>
<th>数学</th>
<td>100</td>
<td>45</td>
<td>60</td>
</tr>
<tr>
<th>语文</th>
<td>100</td>
<td>60</td>
<td>80</td>
</tr>
<tr>
<th>英语</th>
<td>99</td>
<td>100</td>
<td>30</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>总分</th>
<td>200</td>
<td>200</td>
<td>200</td>
</tr>
</tfoot>
</table>
</div>
</body>
对比参数
| 荏狸十三 | 肉球 | 周一 | |
|---|---|---|---|
| 数学 | 100 | 45 | 60 |
| 语文 | 100 | 60 | 80 |
| 英语 | 99 | 100 | 30 |
| 总分 | 200 | 200 | 200 |
thead //表格头部,表示一组定义表格的列头的行。
tbody //内容主体封装了一组表行(``````元素),表示它们包含表的主体(``````)。
tfoot //表格尾部,定义了一组表格中各列的汇总行。
tr //表示tbody里面的一行th //表示表格的头部。
td //表格的内容。
样式
border-spacing: 0px; //表示表格间距为0,调整表格的间隙。
table-layout: auto; //auto表示会自动计算每一排的列和行的间距。
border-collapse: collapse; //让表格合并。