这篇博客是对html基本骨架标签的初步了解,如需深入了解各标签的详细使用,请在MDN(国外网站)查找具体的细节,下面开始进入正题
html页面最基本的组成
由于html5的文档类型声明是向下兼容的,所以现在基本都是使用html5的文档类型声明。
下面是一个html页面最基本的三个标签
<!DOCTYPE html> 这个声明是告诉浏览器,我的html文档类型是什么
<html>
<head></head>
<body></body>
</html>
1.<html></html>
一个html页面的根元素,所有其他元素都必须是他的子元素
2.<head></head>
包含html页面的通用信息,包括如文档标题、文档字符编码类型、文档的引入的脚本和样式等
3.<body></body>
页面所有的展示的内容都将放入到这个标签中
head中常用的标签
4.<title></title>
此标签用于定义文档的标题,只可以包含文本(如果写了标签,则标签会被当作字符显示)
5.<meta>
此标签通过标签中的属性来声明文档的相关信息
例如:
<meta charset="utf-8"> 这个声明了我的html文档是使用utf-8编码
6.<link>
此标签用来引入一个外部的CSS样式文件,通过href属性来指定样式文件的地址
7.<script></script>
此标签用于引入一个外部的JS脚本文件,通过src属性来指定脚本文件的地址,标签中间写的JS代码将不会被执行
如果要想在页面中直接写CSS样式和脚本代码呢,那么在 <style></style> 之间写入CSS即可,在 <script></script> 写入你的JS代码即可
body中常用的区块划分标签
html5出来之前,区块划分都是使用 <div></div> 标签设置一个class来划分一个html页面的各个区块,有了html5之后,就有了更加语义化的标签
8.<header></header>
此标签表示一个页面的头部区块
9.<footer></footer>
此标签表示一个页面的底部区块
10.<nav></nav>
此标签表示一个页面导航区块
11.<article></article>
此标签一般表示文章、博客内容等的独立内容区块
12.<aside></aside>
此标签一般用于和其余部分有联系,但被单独的拆分出来而不会使整体受影响的区块,通常用于表示侧边栏
13.<section></section>
页面除了头部区块和尾部区块,其他区块一般使用这个来表示,并会搭配h1-h6中的标签来辨识每个区块
14.<address></address>
此标签一般表示一个联系信息的区块
总结:
一个html文档由文档声明和一个根元素html组成,根元素html又由head元素和body元素组成, head元素中的元素都是用来表示文档相关的通用信息,body元素中的元素则是html页面的各个区块。至此,就是本篇博客的全部内容。如此博客中有说的不对的地方欢迎批评指正。
网友评论