一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第8天,点击查看活动详情。
是什么让我们在大晚上相遇?可能就是一个小菜鸡想转型为前端程序员的心吧。
图片标签 超文本标记标签
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<!-- 图片 img -->
<!-- alt:图片文字提示(不建议使用),在文件出现错误的情况下alt才会出现 -->
<img src="ing/bilibili.jpeg" alt="bilibili"/>
<!-- <img src="./img/bilibili.jpeg" /> -->
<!-- a:标记 href -->
<!-- href属性:执行要链接的地址 -->
<a href="https://www.baidu.com/">百度</a>
</body>
</html>
列表标签
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!-- 列表的分类 -->
<!-- 无序的列表
有序的列表 -->
<!-- 无序列表:ul li -->
<!-- 属性type 决定了无序列表的格式
type="disc" 实心圆点 默认的
type="circle" 空心圆
type="square" 方块儿 -->
<ul type="square">
<li>11</li>
<li>22</li>
<li>33</li>
</ul>
<!-- 有序列表 ol和li组合 -->
<!-- 属性type 决定了有序列表的格式
type="1" 1 2 3默认的
type="a" a b c d
type="A" A B C D
type="i" 小写罗马文依次进行排列
type="I" 大写罗马文依次进行排列 -->
<ol type="I">
<li>44</li>
<li>55</li>
<li>66</li>
</ol>
</body>
</html>
表格
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<!-- 表格 -->
<!-- table tr行 td列 -->
<!-- border:表格的边框 给他一个值 -->
<table border="1">
<tr>
<td>金牌</td>
<td>银牌</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
</table>
</body>
</html>
2. ## 表格的基本属性
</table>
<!-- bg:background的缩写 背景 -->
<table border="1" style="border-collapse: collapse;" bgcolor="darkseagreen">
<!-- 跨列,纵向单元格的合并
通过td上使用colspans属性实现 -->
<tr>
<td><strong>排名</strong></td><!-- 第一行第一列 -->
<td>代表团</td><!-- 第一行第二列 -->
<td colspan="3">奖牌</td>
<!-- <td>金牌</td>
<td>银牌</td>
<td>铜牌</td> -->
<td>合计</td>
<tr>
<td>1</td><!-- 第二行第一列 -->
<td>山东</td><!-- 第二行第二列 -->
<td>58</td>
<td>55</td>
<td>47</td>
<td>160</td>
</tr>
<tr>
<td>2</td><!-- 第三行第一列 -->
<td>广东</td><!-- 第三行第二列 -->
<td>54</td>
<td>32</td>
<td>56</td>
<td>142</td>
</tr>
<tr>
<td>3</td><!-- 第四行第一列 -->
<td>浙江</td><!-- 第四行第二列 -->
<td>44</td>
<td>35</td>
<td>37</td>
<td>116</td>
</tr>
</table>
</body>
</html>