HTML标签详解

一 、页面结构

<!--标注页面为标准模式,若不加“<!DOCTYPE html>”,则为严格模式-->
<!DOCTYPE html>
<!--标注网站内容特征,便于搜索引擎爬虫查找-->
<html lang="en">
<head>
<!--标注页面字符格式为‘万国码’,可识别大多数语言-->
    <meta charset="UTF-8">
    <!--标注页面移动端可视化窗口为自适应,且缩放比例为1-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--标注浏览器兼容版本-->
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!--标注网页标题-->
    <title>Document</title>
</head>
<body>
</body>
</html>

二、常用标签及其作用

-----按格式分:

1类, 双标签, 修饰包含内容; 
  <h1></h1>  , 1 独成一段;2 字体大小(h1-h6,字体逐渐增大);3 加粗.
  <p></p>  , 独成一行.
  <strong></strong> , 加粗.
  <em></em> , 斜体
  <div></div> , 块级标签
  <span></span> , 行级标签
  <ol>
     <li></li>
  </ol>  , 有序列表.
  <ul>
      <li></li>
  </ul>  ,无序列表.
  <a target="_blank"(在新标签页中打开)></a> , 
     1 超链接;
     2 锚点 ,<a href="#div1"></a>,点击定位到页面特定元素(元素id=‘div1’);
     3 协议限定符,(<a href="javascript:   "></a>);

2类, 单标签,功能作用;
  <hr> , 水平线.
  <br> ,换行.
  <meta> ,文件标注.
  <img alt=" 图片占位符 展示文字信息(图片正常不显示时可见)"  title="图片提示符"(鼠标移动到图片上方显示信息) src="图片路径">

三、主流浏览器

浏览器   =    shell     +     内核
IE                           trident
Firefox                      Gecko
Google Chrome             Webkit / blink
Safari                       Webkit 
Opera                        presto

猜你喜欢

转载自blog.csdn.net/baidu_33390443/article/details/81567034
今日推荐