一、HTML的基本结构
<html> 根控制标记
<head> 头控制标记
<title>标题</title> 标题标记
</head> 头控制标记(尾)
<body> 网页显示区域
</body> 网页显示区域(尾)
</html> 根控制标记(尾)
双标签:开头和结尾成对出现,如<html> </html>
单标签:斜杠在标签元素的后面 和元素之间有一个空格,如<hr /><br /><meta />
行内元素,行内标签:标签在同一行显示 不会换行
块级标签:每个标签单独成一行显示
二、HTML的控制标记的格式
(1).<标记名称>单一型,无设置值的。如:<br />
(2).<标记名称 属性="属性值">单一型,有设置值的。如:<hr width="80%">
(3).<标记名称>…</标记名称>对称型,无设置值。如:<title>…</title>
(4).<标记名称 属性="属性值">…</标记名称>对称型,有设置值。
如:<body bgcolor="red">…</body>
<palign= "center">…</p>
三、最常用的控制标记
1.标题文字设置
格式:<h1>…</h1> 一级标题 只能出现一次(其他可以出现多次)
<h2>…</h2> 二级标题
<h3>…</h3> 三级标题
<h4>…</h4> 四级标题
<h5>…</h5> 五级标题
<h6>…</h6> 六级标题
一共是6个标题级别,一级标题最大,6级标题最小。默认加粗显示
属性名称 属性值 说明
align left 靠左对齐
center 居中对齐
right 靠右对齐
justify 两端对齐
如:设置二级标题为靠右对齐:<h2 align="right">2级标题</h2>
2.段落<p>
格式:<p align="排列方式">段落内容</p>
属性名称 属性值 说明
align left 文本左对齐(默认)
center 文本居中对齐
right 文本右对齐
justify 文本两端对齐
如:设置段落为居中对齐:<p align="center">段落居中对齐</p>
3.换行<br> 格式:<br /> 无属性设置 功能:强制换行
4.水平直线<hr>
格式:<hr />
属性名称 属性值 说明
size 像素 规定 hr 元素的高度(厚度)属性值越大,线越粗
width 像素 绝对设置,长度不会随着窗口的改变而改变
百分比 相对设置,长度会随着窗口宽度而改变
noshade noshade 规定 hr 元素的颜色呈现为实体线
align left hr 元素左对齐(默认)
center hr 元素文本居中对齐
right hr 元素文本右对齐
color 设置水平直线的颜色
如:设置水平直线的宽度为窗口的60%,对齐为左对齐,高度为10,实体线,绿色
<hr width="60%" align="left" size="10" noshade="noshade" color="#009933" />
5.格式:背景色与文字设置
<body bgcolor="背景色" text="文字颜色">
整体页面的边距
<body leftmargin="左边距" rightmargin="右边距"
topmargin="上边距" bottommargin="底边距">
6.文本的显示格式
格式:<font size="字体大小" face="字体类型" color="字体颜色"></font>
属性名称 属性值 说明
size 1~7 绝对设置,把字号设置为X
+1~+6 相对设置,把原字号通过+X设置为新字体
-1~-6 相对设置,把原字号通过-X设置为新字体
color 设置文本的颜色
face 设置文本的字体
文字默认是3号字,文字大小中1号最小,7号最大
7.特殊字符设置
特殊字符 (空格)写完特殊字符后要添加 分号;表示结束
格式:<: <
>: >
&: &
": & quot;
空格:
版权图标 : ©
8.HTML 备注(注释) 格式:<!--注释内容-->
9.实体字符控制标记
<b>…</b> 粗体
<i>…</i> 斜体
<s>…</s> 删除线
<u>…</u> 下划线
<sub>…</sub> 下标
<sup>…</sup> 上标
10.语意字符控制
<address>…</address> 地址
<del>…</del> 删除(删除线)
<ins>...</ins> 修改(下划线)
<strong>…</strong> 加强语气(加粗)
<em>...</em> 加强语气(倾斜)
11.格式化
格式:<pre>…</pre>
让书写的文字格式化!格式化标签 保留在html设置的格式 识别手动的空格和换行 很少使用
12.<blockquote>缩排标签</blockquote>可以嵌套,缩排多次
本文出自 “Raffaele” 博客,请务必保留此出处http://raffaele.blog.51cto.com/6508076/1553022
原文地址:http://raffaele.blog.51cto.com/6508076/1553022