a标签的用法
什么是a标签?
a标签是可以创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接
a标签属性
href 包含超链接指向的 URL 或 URL 片段
<a href="http://www.baidu.com/">百度一下</a>
target 指定在何处显示链接的资源,取值如下
<a href="http://www.baidu.com/" target="_blank">百度一下</a>
<a href="http://www.baidu.com/" target="_top">百度一下</a>
<a href="http://www.baidu.com/" target="_parent">百度一下</a>
<a href="http://www.baidu.com/" target="_self">百度一下</a>
download此属性指示浏览器下载 URL 而不是导航到它,因此将提示用户将其保存为本地文件
<a href="http://www.xxx.com/xxx.exe" download>百度一下</a>
img标签的用法
什么是img标签?
img 代表文档中的一个图像
img标签属性
alt定义描述图像的替换文本。如果图像的URL是错误的、该图像不在支持的格式列表中、或者如果图像还没有被下载,用户将看到这个显示。
<img src="1.jpg" alt="图片加载失败" />
width hight定义图像的高度,width/height只指定一个值,则另一个会根据原始图像进行赋值。
<img width="100" src="1.jpg" alt="图片加载失败" />
<img hight="100" src="1.jpg" alt="图片加载失败" />
src图像的 URL,这个属性对img元素来说是必需的。
img响应式
max-width 100% 该属性值会对元素的宽度设置一个最高限制,适用于多尺寸设备完整显示图像。
<style>
img {
max-width: 100%;
}
</style>
<img src="1.jpg" alt="图片加载失败" />
table标签的用法
什么是table标签?
table 元素表示表格数据
table标签
table
thead
tbody
tfoot
tr
td
th
table样式
table-layout="auto"大多数浏览器采用自动表格布局算法对表格布局。表格及单元格的宽度取决于其包含的内容。
table-layout="fixed"表格和列的宽度通过表格的宽度来设置,某一列的宽度仅由该列首行的单元格决定。在当前列中,该单元格所在行之后的行并不会影响整个列宽。
border-collapse属性是用来决定表格的边框是分开的还是合并的。在分隔模式下,相邻的单元格都拥有独立的边框。在合并模式下,相邻单元格共享边框。
border-spacing属性指定相邻单元格边框之间的距离(只适用于边框分离模式 )。相当于 HTML 中的 cellspacing 属性,但是第二个可选的值可以用来设置不同于水平间距的垂直间距。
<style>
table{
width: 600px;
table-layout:auto;
border-spacing: 0px;
border-collapse: collapse;
}
td,th{
border: 1px solid blue
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th></th>
<th>小小红</th>
<th>小白</th>
<th>小花</th>
</tr>
</thead>
<tbody>
<tr>
<td>数学</td>
<td>88</td>
<td>85</td>
<td>80</td>
</tr>
<tr>
<td>语文</td>
<td>88</td>
<td>85</td>
<td>80</td>
</tr>
<tr>
<td>英语</td>
<td>88</td>
<td>85</td>
<td>80</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>总分</th>
<td>200</td>
<td>220</td>
<td>230</td>
</tr>
</tfoot>
</table>
</body>
</html>
其它感想
暂无特别延伸的感想,上述元素还需要不断练习实践,才能够更好的配合使用...