html基础

什么是html5和它的优势

HTML5作为HTML的最新版本,是HTML的传递和延续。经历HTML4.0、XHTML再到HTML5从某种意义上讲,这是HTML超文本标签语言的更新与规范过程。因此,HTML5并没有给用户带来多大的冲击,大部分标签在HTML5版本中依然适用。
HTML5的优势主要体现在兼容、合理、易用三个方面,本节将做具体介绍。
HTML5并不是对之前HTML语言颠覆性的革新,它的核心理念就是要保持与过去技术的完美衔接,因此HTML5有很好的兼容性。
HTML5中增加和删除的标签都是对现有的网页和用户习惯进行分析、概括而推出的作为当下流行的标签语言,HTML5严格遵循 “简单至上”的原则。
<!DOCTYPE>标签 位于文档的最前面,用于向浏览器说明当前文档使用哪种 HTML 或 XHTML 标准规范。
<html’> 标签 位于<!DOCTYPE> 标签之后,也称为根标签,用于告知浏览器其自身是一个 HTML 文档。
<head’>标签用于定定义HTML文档的头部信息,也称为头部标签,紧跟在“<html’>”标签之后,主要用来封装其他位于文档头部的标签。
<body’>标签用于定定义HTML文档所要显示的内容,也称为主体标签。浏览器中显示的所有文本、图像、音频和视频等信息都必须位于<body’>标签内。
在HTML页面中,带有“< >”符号的元素被称为HTML标签,如上面提到的“<html’>”、”<head’>”、”<body’>”都是HTML标签。所谓标签就是放在“< >”符号中表示某个功能的编码命令,也称为HTML标签或HTML元素,本书统一称作HTML标签

标签概述

双标签也称体标签,是指由开始和结束两个标签符组成的标签。
单标签也称空标签,是指用一个标签符号即可完整地描述某个功能的标签。
HTML标签的作用原理就是选择网页内容,从而进行描述,也就是说需要描述哪个元素,就选择哪个元素,所以才会有双标签的出现,用于定义标签作用的开始与结束。而单标签本身就可以描述一个功能,不需要选择。例如,水平线标签<hr /‘’>,按照双标签的语法,它应该写成“<hr’></hr’>”,但是水平线标签不需要选择,本身就代表一条水平线,此时写成双标签就显得有点多余,但是又不能没有结束符号,所以在标签名称后面加一个关闭符,即<标签名 />。

标签的关系

并列关系也称为兄弟关系,就是两个标签处于同一级别,并且没有包含关系。例如在HTML5的结构代码中,<head’>标签和<body’>标签就是并列关系。在HTML标签中,无论是单标签还是双标签,都可以拥有并列关系。

标签的属性

“键值对”可以理解为对“属性”设置“属性值”。键值对有多种表现形式,例如color=”red” 、width:200px;等,其中color和width即为“键值对”中的“键”(英文key),red和200px为“键值对”中的“值”(英文value)。“键值对”广泛地应用于编程中,HTML属性的定义形式“属性=”属性值””只是“键值对”中的一种。

HTML5文档头部相关标签

<title‘>标签用于定义HTML页面的标题,即给网页取一个名字,必须位于<head’>标签之内。
<‘meta />标签用于定义页面的元信息,可重复出现在<’head’>头部标签中。
一个HTML文档只能含有一对<title‘></title’>标签,<title‘></title’>之间的内容将显示在浏览器窗口的标题栏中。
<title‘>网页标题名称</title’>

文本控制标签

无论网页内容如何丰富,文字自始至终都是网页中最基本的元素。为了使文字排版整齐、结构清晰,HTML中提供了一系列文本控制标签,如标题标签<h1‘>~<h6’>、段落标签<P‘>等

页面格式化标签

HTML提供了6个等级的标题,即<h1’>、<h2‘>、<h3’>、<h4‘>、<h5’>和<h6‘>,从<h1’>到<h6‘>标题的重要性依次递减。

页面格式化标签

在网页中使用

标签来定义段落。<p’>标签是HTML文档中最常见的标签,默认情况下,文本在一个段落中会根据浏览器窗口的大小自动换行。

1
<p align="对齐方式">段落文本</p>
在网页中常常看到一些水平线将段落与段落之间隔开,使得文档结构清晰,层次分明。水平线可以通过<hr /’>标签来定义。
1
2
3
4
5
6
<hr 属性="属性值" />

水平线标签
在网页中常常看到一些水平线将段落与段落之间隔开,使得文档结构清晰,层次分明。水平线可以通过<hr />标签来定义。


属性名 含义 属性值
align 设置水平线的对齐方式 可选择left、right、center三种值,默认为center,居中对齐显示。
size 设置水平线的粗细 以像素为单位,默认为2像素。
color 设置水平线的颜色 可用颜色名称、十六进制#RGB、rgb(r,g,b)。
width 设置水平线的宽度 可以是确定的像素值,也可以是浏览器窗口的百分比,默认为100%。

换行标签

在word中,按【Enter】键可以将一段文字换行显示,但在网页中,如果想要将某段文本强制换行显示,就需要使用换行标签

文本样式标记

用来控制网页中文本的字体、字号和颜色。
1
<font 属性="属性值">文本内容</font>
文本样式标记常用属性
属性名 含义
face 设置文字的字体,例如微软雅黑、黑体、宋体等
size 设置文字的大小,可以取1到7之间的整数值
color 设置文字的颜色
标记 显示效果
<b‘></b’>和<strong‘></strong’> 文字以粗体方式显示(XHTML推荐使用strong)
<i‘></i’>和<em’></em‘> 文字以斜体方式显示(XHTML推荐使用em)
<s‘></s’>和<del’></del‘> 文字以加删除线方式显示(XHTML推荐使用del)
<u‘></u’>和<ins‘></ins’> 文字以加下划线方式显示(XHTML不赞成使用u)

版权声明: 本网站所有文章除特别声明外,著作权归作者所有。转载请注明出处!

-------- 本文结束 感谢阅读 --------