HTML文字颜色与排版

1、HTML中颜色表示法

三种表示方法:
(1)直接用英文单词表示,例如:white(白色)
(2)以六位十六进制表示,例如:#ffffff(白色)
(3)以RGB模式表示,也就是用3个0至255之间的数字来分别表示红绿蓝三色的比重,例如 rgb(255,255,255) (白色)

2、回车换行<br />

解释:单标签、无属性标签,用于强制换行

3、段落<p>

解释:用以区别文字的不同段落
格式:<p align="参数">…</p>
align参数取值:left(默认)、center、right,分别表示段落文字居左、居中、居右对齐。

4、水平线 <hr />

解释:单标签,显示水平线,段落之间的分隔
格式:<hr />
属性:

  • size:设置水平分割线的粗细,以数值表示,值越大,线越粗。以百分比表示,百分比越大,线越粗。
  • width:设置水平分隔线的宽度,以数值表示,宽度固定。以百分比表示,窗口随着百分比变化。
  • align:设置对齐方式(left,center,right),默认center。
  • color:设置颜色,默认black(黑色)。
  • noshade:取消水平线阴影

使用建议:不建议直接使用,建议使用样式替换。

5、居中对齐<center>

解释:双标签,用于文字图片等居中显示,被废弃的标签,html5不支持。
格式:<center>…</center>

6、预格式化文本标签<pre>

解释:双标签,用于保留原始文字排版格式(空格、换行等)显示。
格式:<pre>…</pre>

7、空格

解释:用 表示,两个空格表示一个汉字的位置。
使用建议:HTML会自动截去多余的空格。不管你加多少空格,都被看做一个空格

8、文字标签<font>

解释:规定文本的字体、字体尺寸、字体颜色
格式:<font>…</font>
属性:

  • size:设置文字大小,参数取值范围1-7,数字越大,字体越大。默认3
  • color:设置文字颜色,默认黑色
  • face:设置文字使用字体,默认宋体

9、标题文字

<h1>…</h1>:一号标题

<h2>…</h2>:二号标题

<h3>…</h3>:三号标题

<h4>…</h4>:四号标题

<h5>…</h5>:五号标题

<h6>…</h6>:六号标题
说明:数字越小字体越大

10、引用文本<blockquote>

解释:用于语句块的引用
格式:<blockquote>…</blockquote>
属性:属性名称cite,属性值为URL

11、逻辑字体

解释:不指明字体如何显示,让Web浏览器自行决定显示方式。

<address>将网页需要显示的地址文字突出显示,斜体显示。</address>
<em>用于强调,斜体表示</em>
<strong>特别强调,粗体显示</strong>
<code>显示命令与代码</code>
<samp>用于字母序列</samp>
<kbd>定义键盘文本</kbd>
<var>表示程序变量名,斜体显示</var>
<dfn>对特殊术语或短语的定义,斜体显示</dfn>
<cite>用于标题文字,斜体显示</cite>

<strike>删除线</strike>
<small>缩小字体,比网页字体减少一号</small>

<big>放大字体,比网页中缺省字体放大一号</big>

12、物理字体

解释:物理字体明确了字体类型,表明无论何种浏览器遇到这些标签,都以相同的方式显示。
<b>粗体</b>
<i>斜体</i>
<u>下划线</u>
<sup>上标,将文字显示为上标</sup>
<sub>下标,将文字显示为下标</sub>

<tt>宽字体显示文字,相当于打字机的效果</tt>
<s>删除线</s>