HTML5 初步了解

这是HTM5L的第一篇博客.

那么就让我们简单的了解HTML5的语法吧.

(HTML5运行环境要求极低,非关键地方就不做截图了)

<!--根标签-->

<html>

<!--头部标签-->

<!--

src和href的区别

src:引用,该资源是页面不可缺少的一部分,如(img标签 video标签 radio标签);

href:引入,引入外部资源,如(a标签 link标签)

-->

  <head>

     <meta charset="UTF-8">

     <title>第一个程序</title>

  </head>

<!--身体标签-->

  <body>

     你好,世界!

  </body>

</html>

上面的代码是最最简单的代码

下面是一些常用标签

<!--根标签-->

<html>

<!--头部标签-->

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<!--身体标签-->

<body>

<!--标题标签-->

    <h1>旭宝爱吃鱼</h1>

    <h2>旭宝爱吃鱼</h2>

    <h3>旭宝爱吃鱼</h3>

    <h4>旭宝爱吃鱼</h4>

    <h5>旭宝爱吃鱼</h5>

    <h6>旭宝爱吃鱼</h6>

    <div>旭宝爱吃鱼</div>

    <div>旭宝爱吃鱼</div>

    <div>旭宝爱吃鱼</div>

    <div>旭宝爱吃鱼</div>

<!--段落标签-->

    <p>旭宝爱吃鱼</p>

    <p>旭宝爱吃鱼</p>

    <p>旭宝爱吃鱼</p>

<!--输入框标签-->

    <input><br>

    <input placeholder="请输入用户名"><br><br><br>

    <input value="旭宝爱吃鱼"><br>

    <input type="color"><br>

    <input type="checkbox"><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://www.baidu.com/img/bd_logo1.png" width="150" height="150">

  <!--列表标签-->

   <ul>

       <li>旭宝爱吃鱼->1</li>

       <li>旭宝爱吃鱼->2</li>

       <li>旭宝爱吃鱼->3</li>

       <li>旭宝爱吃鱼->4</li>

   </ul>

  <!--容器标签-->

   <div>旭宝爱吃鱼</div>

</body>

</html>

秒客网

HTML5 初步了解

相关文章