1、加载图片的案例：
本地图片将图片放置该html同级目录下路径名称可直接填写图片名称，否则需要填写具体地址；
这里省略了<>，不然简书这边不显示代码内容而是个样式了，不知道什么鬼，是不是样式同步了，还请大神指导；
img src="图片路径（可本地图片也可网络url图片)" width="200px" style="border: 1px solid red; border-radius: 5px;" alt="小美妞.png"
ps：假如想缩放图片，可以设置一个宽度，会按比例缩放，可不设高度。
在img里面还可加如下属性：
< ... alt="这是一个鼠标选中浮动提示" > (以前alt是给图片设置浮窗提示，现为图片不存在时文本提示了，如需图片加浮窗提示效果可以div+CSS）；
< ... border="1px"> (单纯设置图片边框大小，类似于iOS端的layer.border)；
< ... style="border:2px solid red;" (设置图片边框颜色借助CSS样式)；
写一条就是显示一张图片，复制几条，加载多少张，网页宽度排列不下去可自动换行.
2、文本链接：
<a href="http://www.w3school.com.cn/" title="点击进入w3c学习库" > 相关属性可查找w3school:GO </a> （title:文本浮窗提示）
图片加载、链接加载.png
<html>
<!-- 设置中文环境 展示的时候不乱码 -->
<meta charset="UTF-8">
<title>html基本属性练习</title>
<body>
<!-- 以前alt是给图片设置浮窗提示，现为图片不存在时文本提示了 -->
<!-- 这里简书上格式冲突会加载不出img设置代码，so用中文《代表< -->
《img src="小美妞.png" width="200px" style="border: 1px solid red; border-radius: 5px;" alt="小美妞.png" /》<br/><br/>
《img src="http://cdn-qn0.jianshu.io/assets/web/logo-58fd04f6f0de908401aa561cda6a0688.png"》<br/><br/>
<!-- title：文本浮框提示 -->
<a href="http://www.w3school.com.cn/" title="点击进入w3c学习库" > 相关属性可查找w3school:GO </a><br/><br/>
</body>
</html>
3、表格加载：
<html>
<meta charset="utf-8">
<title>表格布局</title>
<body>
<table border="3px" bgcolor="yellow" width="400px" align="center">
<!-- 一个tr代表一行 一个td代表一列 -->
<!-- 优先级为就近原则 -->
<tr align="center">
<td>1</td>
<td align="right">4</td>
<td>7</td>
</tr>
<tr>
<td>2</td>
<td>5</td>
<td>8</td>
</tr>
<tr>
<td>3</td>
<td>6</td>
<td>9</td>
</tr>
</table>
</body>
</html>
表单.png
菜谱表单练习：
重点掌握几个属性：
让表格上下移动，可以添加一个假的table
<table height="200px">
<tr><td></td></tr>
</table>
<!-- cellspacing横向单元格之间的距离 cellpadding单元格内字距离格子左边的距离-->
<table border="1px" bordercolor="red" cellspacing="0" cellpadding="0" width="400px" align="center">
<!-- colspan="3"该列占三列-->
<td align="center" colspan="3">星期一菜谱</td>
<!-- rowspan="2"该行垂直占2行 -->
<td rowspan="2">素菜</td>
菜谱表单.png
案例源码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>星期一菜谱</title>
</head>
<body>
<!-- cellspacing横向单元格之间的距离 cellpadding单元格内字距离格子左边的距离-->
<table border="1px" bordercolor="red" cellspacing="0" cellpadding="0" width="400px" align="center">
<!-- 第一组 -->
<tr>
<!-- colspan="3"该列占三列-->
<td align="center" colspan="3">星期一菜谱</td>
</tr>
<!-- 第二组 -->
<tr>
<!-- rowspan="2"该行垂直占2行 -->
<td rowspan="2">素菜</td>
<td>清炒茄子</td>
<td>花椒扁豆</td>
</tr>
<!-- 第三组 -->
<tr>
<td>小葱豆腐</td>
<td>炒白菜</td>
</tr>
<!-- 第四组 -->
<tr>
<td rowspan="2">荤菜</td>
<td>油焖大虾</td>
<td>海参鱼翅</td>
</tr>
<!-- 第五组 -->
<tr>
<td>红烧肉</td>
<td>烤全羊</td>
</tr>
</table>
</body>
</html>
