HTML的模板元素
2021/12/17 23:25:52
本文主要是介绍HTML的模板元素,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
模板元素:
<!DOCTYPE>元素:
1.<!DOCTYPE>元素位于文档的开头,用于向浏览器说明html或xhtml文档使用的是哪一版本;
2.目前html的最新版本是html5,但是还处于发展完善过程中,xhtml算是html的过渡;
3.使用html5写<!DOCTYPE html>;
<meta>元素:
1.<meta>元素(元数据标签)嵌套在<head> </head>中,用于添加页面的元信息(meta-information);在html中<meta>元素不用闭合,但是在xhtml中需要闭合;
2.<meta>元素的属性有http-equiv、name和content等,并且content一定要始终和http-equiv或name属性配合使用;
3.<meta charset="utf-8">,charset属性是html5的新属性,定义了html文件中的字符编码,替换了<meta http-equiv="Content-Type" content="text/html" charset="utf-8">,但是现在仍然可以使用老方法,用http-equiv属性定义字符编码方式,但是新方法减少了代码的书写量;
4.<meta http-equiv="X-UA-Compatible" content="IE=edge">,X-UA-Compatible属性用于对网页兼容性模式进行设置,其content值IE=edge表示以目前最高版本的IE引擎对页面进行渲染,此外,X-UA-Compatible属性是IE8时引入的,所以IE8一下的浏览器对其并不支持;
5.<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">,相比上一条语句多了个chrome=1,是指,在安装了GCF(GoogleChromeFrame)的情况下,优先使用chrome引擎渲染页面,没有安装GCF的话就使用当前最高版本的IE引擎渲染;
6.<meta name="viewport" content="width=device-width, initial-scale=1">.
<head>元素:
1.<head></head>标签用于存放meta、link、script、title、style、base标签,总之,<head></head>标签中存放的都是帮助浏览器理解的内容;
2.其中<title> 标签是<head>中唯一不可缺少的标签;<title> 标签中的文本会在页面显示时,作为整个页面的标题出现在浏览器窗口顶部的标题栏中。
<link>标签:
1.<link>标签最常见的用途就是链接外部样式表stylesheet,它用于规定文档与外部文档的关系;此外,它是空标签,即只包含属性信息,并且它只出现在head范围内,head中唯一一个非空的标签就是<title></title>了;
2.<link rel="stylesheet" type="text/css" media="screen" href="main.css">,rel属性用于说明外部文档与当前文档之间的关系;type属性用于规定外部文档的MIME类型,css的MIME类型是"text/css";href属性表示被链接的外部文档的地址;media属性表示被链接文档将会被显示在什么设备上;
<script>标签:
1.<script src="main.js"></script>;
2.<script>标签常用于规定页面的脚本,其中脚本语句可以写在<script></script>中也可以通过src属性,定义外部脚本的地址进行引入;type属性之前是必须属性但是在html5中不是,它用于规定脚本的MIME类型,JavaScript的MIME类型是"text/javascript"。
<body>元素:
主体元素,包含网页的实体部分。
补充:meta标签的常见用途
1.使用charset属性指定字符集<meta charset="utf-8">
2.用作视窗meta标签缩放页面
<meta name="viewport" content="width=device-width,initail-scale=1.0">
这篇关于HTML的模板元素的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-24Vite多环境配置学习:新手入门教程
- 2024-11-23实现OSS直传,前端怎么实现?-icode9专业技术文章分享
- 2024-11-22在 HTML 中怎么实现当鼠标光标悬停在按钮上时显示提示文案?-icode9专业技术文章分享
- 2024-11-22html 自带属性有哪些?-icode9专业技术文章分享
- 2024-11-21Sass教程:新手入门及初级技巧
- 2024-11-21Sass学习:初学者必备的简单教程
- 2024-11-21Elmentplus入门:新手必看指南
- 2024-11-21Sass入门:初学者的简单教程
- 2024-11-21前端页面设计教程:新手入门指南
- 2024-11-21Elmentplus教程:初学者必备指南