HTML有语义标签

最新推荐文章于 2025-03-04 08:52:45 发布

风漫漫雨歇歇

最新推荐文章于 2025-03-04 08:52:45 发布

阅读量1.2k

点赞数

分类专栏： HTML 文章标签： html 有语义标签

本文链接：https://blog.youkuaiyun.com/tst116/article/details/70226472

版权

HTML 专栏收录该内容

3 篇文章

订阅专栏

有语义标签
  <h1></h>
     这个是标题标签，标题标签常与段落标签<p>一起使用，h标签，最多有6个，1-6.

  <img src="juhua.jpg" alt="菊花" title="鼠标放上去显示的文字"/>
     这个标签是引入一张图片，ser是规定引入那张图片，alt是是给浏览器识别这个img时，也解析这个图片的内容信息。
          图片是内联还是块状：图片标签是内联元素，margin没有效果，同事img标签也是替换元素，又有外边距，则可以使用display属性清除边距。

   <ul>
     无序列表  <ul>
                  <li>春</li>
                  <li>夏</li> </ul>
       可以用CSS改变UL标签的显示形式，要影响li标签：list_style-type:square;

   <ol>
      有序列表
          别的和<ul>标签一致。

    <table>
       整齐的表格标签，
          border-collapse: collapse;  CSS中合并单元格重合的边线。
          border-spacing    设置每个单元格的间距

   <a href="https://www.hao123.com/" title="鼠标放上去">123导航</a>
      链接标签 a
      a 标签可以为网页添加锚点，就是访问页面的时候网页太长，可以跳转到页面的某一段，可以为这个页面添加一个锚点，
       <a name="p1"></a>
        访问的时候就是网页链接后添加#加锚点
         eg：www.baidu.com/q.html#p1

伪类：
   a 标签伪类，
    CSS允许我们对a标签的4种状态设置各自的CSS特性，就叫做CSS伪类。
     4种状态分别是：平时、鼠标放上去时、鼠标点击时、鼠标点击后。
        1、active状态一般不写。
        2、书写时有顺序的lvha
        3、link一般可以简写为a

     eg:<a href="https://www.hao123.com/" title="鼠标放上去">123导航</a>
       <style>
           a:link{//平时的CSS样式。

           }
           a:visited{
              //鼠标点击后的CSS样式
           }
           a:hover{//鼠标经过时的CSS
                    color:gray;
           }
           a:activer{//鼠标点击时CSS样式。

           }

       </style>

 字符实体：
   在HTML开发中有一些字符不适合直接写出 ，如大于号、小于号。
    就用别的符号代替 一般的格式为 &+符号+实体名+";"
     使用的时候查HTML文档

eg:<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>我就是你</title>
    <style type="text/css">

     div{
         width: 200px;
         height: 200px;
         background: blue;
     }

     span{
         width:200px;
         height:200px;
         background: red;
         display: block;
         text-decoration: line-through;
     }

     table{
         border-collapse: collapse;
     }
     td{
         border: 1px solid blue;

     }

    </style>
</head>
<body>

    <div id="top">wo jiu shi  ni </div>
    <span id="song">ni  jiu shi wo </span>
    <table>/*建立一个表格*/
        <tr>
            <td colspan="4">1</td>  合并四个单元格

        </tr>
        <tr>
            <td>21</td>
            <td>22</td>
            <td>23</td>
            <td rowspan="2">24</td>
        </tr>
        <tr>
            <td>35</td>
            <td>36</td>
            <td>37</td>

        </tr>
    </table>
    <a href="https://www.hao123.com/" title="鼠标放上去">123导航</a>    <a href="https://www.baidu.com/?tn=96761080_hao_pg">百度</a>
</body>
</html>