HTML常用标签

a标签

1、href 取值

href:hyper reference 超链接

• 网址

<a href="https://xxxx.com"></a>
<a href="http://xxxx.com"></a>
<a href="//xxxx.com"></a>
<!--无协议网址-->

• 路径

<a href="/a/b/c.html"></a>
<!--不是根目录，而是当前打开的目录-->
<a href="c.html"></a>
<!--直接打开当前目录的文件-->

• 伪协议

<a href="Javascript:;"></a>
<!--空的伪协议-->
<a href="mailto:xxx@gamil.com">发邮件给xxx</a>
<a href="tel:xxx-xxxx-xxx">打电话给xxx</a>

• 其他

<a href="#id=xxx"></a>
<!--跳转到“id=xxx”的部分-->

2、targrt 取值

• 内置名字

<a href="" target="_blank"></a>
<!--在一个新的空白界面打开-->
<a href="" target="_top"></a>
<!--顶级窗口-->
<a href="" target="_parent"></a>
<!--上一级窗口-->
<a href="" target="_self"></a>
<!--原窗口打开-->

• 程序员命名

 <a href="https://abc.com" target="xxx" >跳转到abc</a>
 <a href="https://def.com" target="xxx">跳转到def</a>
 <!--第一个跳转的窗口自动成为xxx,第二个的打开的窗口即在此-->

table标签

1、相关标签

• thead
• tbody
• tfoot
• tr
• td
• th

 <table>
       <thead>
       <!--标题-->
           <tr>
           <!--行-->
               <th></th>
               <th>周一</th>
               <th>周二</th>
           </tr>
           
       </thead>
       <tbody>
           <tr>
               <th>上午</th>
               <td>产品发展</td>
               <!--tabel data 数据-->
               <td>教学教研</td>
           </tr>
           <tr>
               <th>下午</th>
               <td>学科启蒙</td>
               <td>家庭教育</td>
           </tr>
           
       </tbody>
       <tfoot>
           <th></th>
           <td>笔试模考</td>
           <td>笔试模考</td>
       </tfoot>
   </table>

2、相关样式

• table-layout auto:自动调整行宽

<style>
        table{
            table-layout: auto;
        }
</style>

<style>
        table{
            table-layout: fixed;
        }
</style>

• border-collapse 合并
• border-sapcing 表格间隔

img标签

1、作用

发出get请求

2、属性

• alt 当图片加载失败时，显示提醒
• width 图片宽度
• height 图片高度 设定高度，宽度自动适应；设定宽度，高度自动适应。

3、事件

• onload
• onerror

4、响应式

max-margin

<style>
        img{
            max-margin=100%
        }
</style>

keep going!!