HTML常用标签

   永远不要使用双击的方式打开HTML页面

我这里推荐两种方式：

使用http-server

yarn global add http-server
http-server -c-1 a.href.html

2.使用Parcel

yarn globle add Parcel
Parcel a-href.html

a 标签的用法

** a标签含义**

<a> 元素可以创建通向其它网页、文件、同一页面内位置、电子邮件地址或任何其他URL的超链接。

** a标签用法**

<a href="//baidu.com" target="">百度</a>
<a href="http://baidu.com">百度</a>
<a href="https://baidu.com"></a>

** href的取值**

1.网址例如 //baidu.com 默认继承可以直接跳转https或者http
2.路径例如 /a/b/c 表示的到根目录，是指HTTP服务开启的目录，而不是硬盘根目录
a/b/c 相对目录
index.html 默认打开当前目录中的index文件
3. 伪协议
javascript:代码;
#id 跳到指定的标签
mailto:邮箱 跳转到指定邮箱
tel:手机号 跳转到拨号页面

** target的取值**
1.内置
_blank 在新的页面打开
_top 在最顶级窗口打开
_parent 当前页面的上一级打开
_self 在自己里面打开
2.iframe标签

img 标签的用法

发送get请求，展示一张图片

<img src="" alt="">

1.属性
alt 错误时显示的文字
src 图片地址
height/width 设置高度跟宽度
2.事件 onload/onerror

<script>
     xxx.onload=function(){
         console.log("图片加载成功");
     };
     xxx.onerror=function(){
         console.log("图片加载失败");
         xxx.src="/404.png";
     };
 </script>

3.响应式

max-width:100% 在任何屏幕下宽度占满屏幕

** table 标签的用法**

<table>
  <thead>
    <tr>
       <th>表头</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>数据</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>总结</td>
    </tr>
  </tfoot>
</table>

table样式
table-layout auto 自动，根据内容 fixed 等距
border-spacing 单元格间距
border-collapse 单元格无间距，是否合并

** form 表单标签的用法**

<form method="传送方式" action="服务器文件">
<input type="submit" value="搞起"/>
<button type="submit">搞起</button>
<input type="radio"/> --单选框 单选用相同name名
<input type="checkbox"/> --复选框 表示一组用相同name名
<input type="file" multiple/> --multiple 表示选中多个文件上传
<input type ="hidden"/> --看不见的+
</from>

HTML入门笔记2

HTML常用标签