html常用标签

web常用标签

1.布局标签：
大区域 div
功能：套图，套段落文字，套小区域，套div。
特性：1.宽度取了父盒子的所有内容的宽度，高度取决于内容大小。
2.独立成行 换行显示

<div>helloword</div>
  <div>helloword</div>
   <div>helloword</div>

      小区域 span
       功能：套小图标，图片，套几个字
       特性：1.宽度，高度取决于内容的大小
                  2.并排放置

  <span>helloword</span><span>helloword</span><span>helloword</span>
  

2.功能标签
图片标签(单标签)
属性：
（1）src设置图片的路径
绝对路径（不会受到本地文件影响）：
网络路径：https://img.alicdn.com/imgextra/i1/O1CN014CrYLF1y42atKGGfJ_!!6000000006524-0-tps-520-280.jpg
本地路径：E:E:/第一阶段/day01/代码/images/u=2471826223,1654648024&fm=26&fmt=auto&gp=0.jpg
相对路径（会受到影响）（更加建议）：
/ 根目录 项目目录最顶级目录 /代码/images/u=2471826223,1654648024&fm=26&fmt=auto&gp=0.jpg
./ 同级目录 ./u=2471826223,1654648024&fm=26&fmt=auto&gp=0.jpg
…/上一级文件夹（跳出了一层文件夹）…/images/u=2471826223,1654648024&fm=26&fmt=auto&gp=0.jpg
…/…/上上级文件夹
(2)alt
设置当图片加载不成功时的提示

 <img src="代码/images/u=2471826223,1654648024&fm=26&fmt=auto&gp=0.jpg" alt="小黄人">
       

     (3)title
       设置鼠标移入时的文字盒子 
       <img src="https://img.alicdn.com/imgextra/i1/O1CN014CrYLF1y42atKGGfJ_!!6000000006524-0-tps-520-280.jpg" alt="" title="奥利给">
     (4)width
       默认属性 宽度
       图片高度默认比例 设置宽度时 图片的高度会自动比例计算 
     (5)height
       默认属性 高度
       图片宽度默认比例 设置高度时 图片的宽度会自动比例计算

3.文本标签
加粗：加粗无语义化标签
加粗语义化标签 可以增加网站的曝光率
区别：语义化标签：机器阅读，搜索引擎的优化 无语义化标签

斜体：<i>斜体无语义</i> 
     <em>斜体有语义</em>

下划线：<u>下划线无语义</u>
       <ins>下划线有语义</ins>

中划线：<s>中划线无语义</s>
       <del>中划线有语义</del>

段落：<p>paragraph 段落 可以看到明显的换行的就是一个段落 
        特性：一般来说只能套文字，也可以套文本标记小类型 span em strong 不能套图片，p元素是平级的</p>

标题： h1到h6
      <h1>一级标题</h1>
      <h2>二级标题</h2>
      <h3>三级标题</h3>
      <h4>四级标题</h4>
      <h5>五级标题</h5>
      <h6>六级标题</h6>
      一个页面有且只有一个h1，建议只用h1到h3不建议用h4及以下的标题

特殊字符（字符实体）：人名币：&yen;
                    版权符号：&copy;
                    空格：&nbsp;
                    大于：&gt;
                    小于：&lt;
换行标签：<br>一个空行 用于文本里做换行
水平线：不可以设置高度<hr>