html5-02 基本标签_关于02的标签-CSDN博客

本文链接：https://blog.csdn.net/YIGNORANT/article/details/53314211

01

<!--根标签-->
<html>
<!--头部标签-->
  <head>
      <!--
      指定编码格式
      注:在chorme中即使没有指定编码，也不会乱码。
         其他浏览器中必须指定编码
      -->
      <meta charset="utf-8">
      <title>RunningMan</title>
  </head>
<!--身体标签-->
  <body>
     Hello，RunningMan!
  </body>
</html>

注： 1.<meta> 标签永远位于 head 元素内部
    2.元数据总是以名称/值的形式被成对传递的

GBK编码
是指中国的中文字符，其中包含简体中文与繁体中文字符。

GB2312
仅能存储简体中文字符。

UTF-8编码
它是一种全国家通过的一种编码，如果你的网站涉及到多个国家的语言，那么建议你选择UTF-8编码。

GBK和UTF8有什么区别？
UTF8编码格式很强大，支持所有国家的语言，正是因为它的强大，才会导致它占用的空间大小要比GBK大，对于网站打开速度而言，也是有一定影响的。
GBK编码格式，它的功能少，仅限于中文字符，当然它所占用的空间大小会随着它的功能而减少，打开网页的速度比较快

02 常用标签

<!--标题标签  由大到小 由粗到细-->
     <h1>11111111111111</h1>
     <h2>11111111111111</h2>
     <h3>11111111111111</h3>
     <h4>11111111111111</h4>
     <h5>11111111111111</h5>
     <h6>11111111111111</h6>
<!--段落标签-->
    <p>pppppppppppppppppppp</p>
<!--输入框标签-->
    <input><br><br>
    <input placeholder="请输入你的银行卡密码"><br><br>
    <input value="hahahahahaha"><br><br>
    <input type="color"><br><br>
    <input type="checkbox"><br><br>
    <input type="date"><br>
    <input type="range"><br>
<!--换行标签-->
    <br>
<!--超链接标签-->
    <a href="http://baidu.com" target="_blank">百度一下，你就知道</a>
<!--图像标签
    相对路径 项目中的资源
    绝对路径 http:// https:// ftp:// file://
    -->
    <img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png" alt="百度" width="100" height="150">
    <img src="Img/7.jpg" width="100" height="150">
<!--列表标签-->
    <ul>
        <li>1111111</li>
        <li>2222222</li>
        <li>3333333</li>
        <li>4444444</li>
    </ul>
<!--容器标签-->
    <div>111111111111111</div>

标签学习

http://www.w3school.com.cn/tags/tag_doctype.asp

03 新闻页详情

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有一种友谊叫runningman 金钟国ins更新又去哪里玩了</title>
</head>
<body>
    <nav>navigation?</nav>
    <!--文章-->
    <article>
        <!--头部-->
        <header>
            <h1>有一种友谊叫runningman 金钟国ins更新又去哪里玩了</h1>
            <h4>来源：深窗综合 | 2016-11-22 15:35 编辑：Link</h4>
        </header>
        <!--章节-->
        <section>
            <h3>1.李光洙</h3>
            <p>11月22日，金钟国个人INS上更新了一张照片，并配文天气好冷，但是我们有一个美好的时光。照片中金钟国同李光洙、haha两人一起合拍，笑得很开心，这又是去哪玩了？</p>
            <p>《Running Man》是韩国SBS电视台在《星期天真好》单元推出的大型户外竞技真人秀节目。节目六位固定主持是刘在石、金钟国、池石镇、河东勋（HAHA）、宋智孝、李光洙，前固定主持宋仲基、朴秀英、姜熙健（Gary）因个人发展原因离开。</p>
        </section>
        <section>
            <h3>2.haha</h3>
            <p>runningman自2010年集结以来一同走过了近7年的时间，七年来的每周一是runningman的固定录制时间，这样每周一次的集结，使得runningman成员间比较建立了深厚的感情，在录制完后或者说工作后，大家都保持着较好的联系，因此成员们私下感情都很好。能这样七年如一真心不容易，所以说有一种友情叫runningman！</p>
        </section>
        <!--尾部-->
        <footer>
            <h5>runningman161127期最新剧照 金钟国宋智孝RM剧照</h5>
        </footer>
    </article>
</body>
</html>

04 控件

<!--进度条-->
<progress value="20" max="100"></progress>
<!--音乐播放器-->
<audio src="Source/music.m4a" controls="controls"></audio>
<!--视频播放器-->
<video src="Source/BigBuck.m4v" controls="controls"></video>