day50

（1）HTML标签

# 1、XHTML更为严格,它要求标签必须小写、必须严格闭合、标签中的属性必须使用引号引起，img必须要加alt属性(对图片的描述)
等等;
xhtml1.0文档类型创建的快捷方式 html:xt + tab
# 2、HTML5是HTML的下一个版本所以除了非常宽松容错性强（可以选择性遵守xhtml制定的文档编写规范）以外,还增加许多新的特性
html5文档类型创建的快捷方式： html:5 + tab 或者 ! + tab


HTML中标签分类
#1、容器类标签
    容器类标签可以简单的理解为能嵌套其它所有标签的标签。
    常见容器级的标签:
    h系列
    ul>li
    ol>li
    dl>dt+dd
    div

#2、文本类标签
    文本级的标签对应容器级标签，只能嵌套文字/图片/超链接的标签。
    常见文本级的标签:
    p
    span
    strong
    em
    ins
    del

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">          <!--字符编码-->
    <meta name="keywords" content="博客，IT，程序">       <!--关键字-->
    <meta name="description" content="welcome">         <!--描述信息（如果有description，一定要放在keyword后）-->
<!--    <meta http-equiv="refresh" content="3,http://www.baidu.com">        &lt;!&ndash;指定某些属性&ndash;&gt;-->
    <title>标题</title>        <!--标题-->
    <link rel="icon" href="psc.png">        <!--ico图片-->
    <link rel="stylesheet" href="css/index.css">
    <script src="js/a.js"></script>
</head>
<body>
<H1>TITLE</H1>
<p1 onclick="change_color(this)">Hello</p1>
<P onclick="change_color(this)">111</P>                  <!--p标签不能包含其他标签-->
<!--<标签名字 属性1="值" 属性2="值">内容</标签名字>-->
<!--注释内容-->
<!--
多
行
注
释
-->
<p>good<br>game</p>         <!--br换行-->
<hr>                        <!--hr分割线-->
<b>加粗</b>
<strong>强调</strong>
<br>
<u>下划线</u>
<ins>插入</ins>
<br>
<i>倾斜</i>
<em>倾斜</em>
<br>
<s>删除线</s>
<del>删除</del>
<br>

<!--字符实体-->
<p>GOOD&nbsp;&nbsp;&nbsp;GAME</p>       <!--&nbsp; 代表一个空格-->
<p>&lt;print&gt;</p>                    <!--&lt; 小于号  &gt; 大于号-->
<p>1000000&yen;</p>                     <!--&yen; ￥-->
<p>g&amp;g</p>                          <!--&amp;  &-->
<p>&copy;</p>

<!--h标签与p标签-->
<h1>DDD</h1>            <!--h标题-->
<h2>DDD</h2>
<h3>DDD</h3>
<h4>DDD</h4>
<h5>DDD</h5>
<h6>DDD</h6>
<P>GGG</P>              <!--p段落-->

<!--img标签-->
<img src="img/1.jpg" title="背景图片" alt="未找到图片" width="500px">
<!--src:文件路径或地址，title:鼠标悬浮时提示，alt:未找到图片时的提示-->

<!--a标签-->
<a href="http://www.baidu.com" title="百度" target="_blank">这是一个超链接</a>
<a href="">假链接</a>

<!--
href：链接地址，title：悬浮时提示，target：默认_self，直接从原页面跳转
href没有指定时为假链接，点击后刷新页面
<a href="javascript:">假链接，不会刷新页面</a>
-->
<!--
<a href="http://www.hao123.com">
    <img src="img/1.jpg" alt="" width="500px">
</a>
-->
<br>
<a href="#p1" style="color: aqua;text-decoration: none">跳到p1</a>
<a href="#p2">跳到p2</a>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p id="p1" style="color: chartreuse">这里是p1</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<a href="" name="p2"></a>
<p>-----这里是p2-----</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<p>123456789</p>
<a href="">跳到首页，会刷新页面</a>
<a href="#">跳到首页，不会刷新</a>
</body>
</html>
字符实体

 

HTML标签

posted @ 2020-09-15 19:51  板鸭没有腿  阅读(139)  评论(0)    收藏  举报