前端开发_HTML5_标签部分(一)

一、如何快速学习标签?
1、记住标签对应的单词
2、该标签在页面产生的作用
3、为了更好的使用该标签，常用的属性有哪一些？

二、结构标签(doctype/html/head/meta/title/body)
1、HTML5标签语法
A:<标签名称>相关内容</标签名称>
B:<标签名称>

我们再Hbuilder中新添加一个.html文件，它会自动生成一个带有HTML结构代码的文件，其结构如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
</html>

2、doctype标签
标签作用:doctype是指的是Document Type(文档类型)的简写。
   作用是说明是使用的HTML是什么版本。HTML5的doctype声明是<!doctype html>
       代码放置在整个html页面的首行。

3、html标签
标签作用:html标签用于表示该文件是以超文本标记语言(html)所编写的。标签成对出现，页面中所有的内容都包在<html>和</html>

html使用语法如下:

<html>
    全部代码内容
</html>

4、head标签
标签作用:表示的是网页的头部标签，主要是放置关于html文件的信息，它包含文件的标题
编码方式以及URL等信息，这些信息为访问该页面所需的一些索引、关键字等信息。

head使用语法如下:

<head>
    头部信息内容。
</head>

5、meta标签
标签作用:元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词、编码方式等，同时<meta> 标签的属性定义了与文档相关联的名称/值对。

meta标签语法

语法:
<meta charset="utf-8">

说明:
charset用于声明字符集，主要是声明页面所需要的编码方式，要显示中文一般使用的有utf-8、gb2312、gbk。我们一般就使用utf-8，这里的utf-8，可以是大写，也可以是小写。

6、title标签
标签作用:用于设置html页面的标题，这一个效果在把页面运行到浏览器的时候会在页面上有对应的效果。如下:

主要代码:

<head>
	<meta charset="utf-8">
	<title>这是前端学习的第一个页面</title>
</head>

title标签语法

<title>标题名字</title>

7、body标签
标签作用:该标签作用是包含这一个页面的主题内容,也就是页面上显示的主要内容。

主要代码:

<body>
	 这里显示页面的主要内容。
</body>

标签语法:

<body>
	 页面主要内容
</body>

前端开发_HTML5_标签部分(一)

猜你喜欢