Day04 HTML标记
路径
./ 同级目录
./ 进入该目录名下
../ 上一级目录
HTML标记
图片
<!--
图片标记
src 图片的路径
width 设置图片宽度
height 设置图片高度
title 鼠标放到图片上时显示标题 利于搜索引擎化
alt 网速慢,或者图片不小心删除,影响用户体验 加载慢, 或者图片不存在,使用alt属性值来提示
特点:多个占一行,可以设置宽高
-->
<img
src="./img/bd2.png"
width="200px"
title="总统"
alt="这是一张总统照片"
/>
<img src = "./img/logo/logo.png" width = "150"/>
列表标记
有序列表
<!--
有序列表
ol中只嵌套li
特点:独占一行,自带样式
-->
<ol>
<li>列表内容 1</li>
<li>列表内容 2</li>
<li>列表内容 3</li>
</ol>
无序列表
<!--
无序列表
ul中只嵌套li
特点:独占一行,自带样式
-->
<ul>
<li>无序列表内容</li>
<li>无序列表内容</li>
<li>无序列表内容</li>
</ul>
自定义列表
<!--
自定义列表
特点:独占一行
-->
<dl>
<dt>中国的城市</dt>
<dd>北京</dd>
<dd>上海</dd>
<dd>内蒙古</dd>
<dt>美国的城市</dt>
<dd>华盛顿</dd>
<dd>纽约</dd>
</dl>
div标记
//特点:独占一行 不自带样式
<div>div</div>
span标记
//特点:多个占一行 不自带样式
<span>span标记</span>
<span>span标记</span>
<span>span标记</span>
表格标记
<table width="500" border="1" cellspacing="0" >
<caption>
<h1>初一各班成绩表</h1>
<!--
tr:行
属性:
height:高度
align:内容水平对齐方式 center:居中 left:居左 right:居右
valign:内容垂直对齐方式 middle top bottom
-->
<tr>
<td>姓名</td>
<td>性别</td>
</tr>
<tr>
<td>欧阳</td>
<td>女</td>
</tr>
<tr>
<td>戴璐</td>
<td>女</td>
</tr>
</caption>
</table>