一、如何快速学习标签?
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>