HTML : Hyper Text Markup Language 超文本标记语言
超级文本标记语言文档制作不是很复杂,但功能强大,支持不同数据格式的文件镶入其主要特点如下:
-
可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。
-
平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上,这也是万维网(WWW)盛行的另一个原因。
-
通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。
下面简单介绍一下HTML中几种常用的标签
<!--html表示HTML文档的开始-->
<!--head 标记网页头部信息 例如字符编码、引入文件、视口设置....-->
<!--charset 设置字符编码 一定要写在head标签下的第一个位置
UTF-8 国际通用编码
acsii GBK GB2312 ...
-->
下面先以代码的形式介绍一下html中各种常用标签的用法(看注释和运行结果)
<!DOCTYPE html>
<!--doc document type html
html5 最新声明方式 在网页加载时,完全按照HTML5新标准来进行解析和加载
-->
<html>
<head>
<!--meta 单标签 用来引入或声明一些内容-->
<meta charset="UTF-8">
<!--title 标题标签-->
<title>这是网页标题</title>
</head>
<!--body 标记网页主题信息-->
<body>
<!--h1~h6 标题标签-->
<!--标签独自占一行空间,称之为块元素-->
<h1>我是h1 我最大</h1>
<h2>我是h2</h2>
<h6>我是h6 我最小</h6>
<!--span 用来标记普通文本-->
<!--标签可以在一行内进行连续展示,不单独占一行,称之为行元素-->
<span>我是span 用来标记普通文本 </span>
<span>我可以在一行内进行连续展示,不单独占一行</span>
<!--<p> 标签定义段落。-->
<p>p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。</p>
<!--a标签 超链接标签-->
<!--url:https://www.baidu.com/ url:统一资源定位符 -->
<!--target="_blank" 新开一个窗口,打开目标地址-->
<a href="https://www.baidu.com/" target="_blank">百度一下,你就上当</a>
<!--img 标记网页中的图片-->
<!--src source 图片来源-->
<!--alt alter 当图片未被加载出来时,以文本方式代替图片显示-->
<!--title 当鼠标停留在图片上时,展示的文本-->
<!--width 设置图片显示宽度,高度会自适应-->
<img src="1.jpg" alt="烤红薯.jpg" width="500" title="你想吃吗?">
<!--div 块元素 标记网页中的一块区域-->
<div>你好,我是div,我是一个块元素,所有不属于div包裹的内容,都要另起一行!</div>
<!--section 组件、模块-->
<section>你好,我是section,我是一个块元素,所有不属于div包裹的内容,都要另起一行!</section>
<!--table 表 块元素-->
<table>
<!--caption 表标题-->
<caption>caption是表标题</caption>
<!--tr 标记表格当中的一行-->
<tr>
<!--th 标记表头中的单元格-->
<th>表头1</th>
<th>表头2</th>
<th>表头3</th>
</tr>
<tr>
<!--td 标记表内容的单元格-->
<td>内容1</td>
<td>内容2</td>
<td>内容3</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
<td>内容3</td>
</tr>
</table>
</body>
</html>
<!--html文档的结束-->
运行结果如下
以上知识掌握之后,就可以简单的学习一下css样式基础的内容了,在之后的学习中,我们也可以随着练习掌握更多的标签用法