1. a标签的用法
<a>,即a标签,a是单词anchor(锚点)的第一个字母。它的作用是跳转到一个元素上。与其他标签一样,它具有许多属性,一些常用的属性如下:
<a>的属性
herf属性。hyper reference超链接的缩写。herf的内容指向<a>跳转的元素。target属性。声明在哪个页面打开需要跳转的元素。若此页面不存在则创建一个新页面并用target中的值命名。download属性。下载而非打开页面,手机浏览器可能不支持。ref=noopener属性。
一些属性的常用取值如下:
herf属性
- 网址:可以是
https://google.com、http://google.com还可以是//google.com。 - 路径:可以是本地文件的一个绝对或相对路径。
/a/b/c、a/b/c、./index.html等。 - 伪协议:包括
js动作、mailto: 邮箱、tel: 手机号等。 - id:
href=#xxx,同页面元素的id,此时点击a标签会跳转到id=xxx的元素。
target属性
- 内置名字:如
_blank、_top、_parent、_self等。 iframe中自定义的名字,代表打开的页面的名字。
2.table标签的用法
<table> table标签,顾名思义就是表格的样式,与之相关的标签如下:
<thead>table head的缩写,只代表包含区域的位置在表头。<th>表头的真正标题。<tbody>表的主体。<tfoot>表结尾部分。<tr>table row代表表格中的一行。<td>table data表格中的内容。 注意<thead>、<tbody>、<tfoot>不一定按顺序出现。
相关样式
table-layout: fixed表示每行/列尽量平均。table-layout: auto则会根据内容的多少来自动调整每行/列的高度或宽度。border-collapse: collapse表示表格内的框线合并。
3.img标签的用法
<img>img标签,image的简称,其作用是发出get请求,展示一张图片。
<img>的属性
src属性。src即为source的简称,声明该图片的来源,可以是一个网址,也可以是图片的本地路径。alt属性。其内容为当图片加载不出来时显示的内容。height,width属性。设定图片的高和宽,注意只设定一个,否则可能会导致图片变形。
事件
<script> xxx.onload= js code </script>当图片加载出来时会执行什么操作。<script> xxx.onerror= js code </script>当图片加载不出来时会执行什么操作。
响应式
- 通过设置样式为
max-width: 100%来确保图片在小屏幕手机上可以完全显示。 此外,img标签/元素还是一个可替换元素
可替换元素指的是一个外部对象,它们外观的渲染不受CSS的控制。CSS规则至多影响可替换元素的位置,不会影响其内容。