文字布局(TEXT STYLE)标记(TAGS)


行的控制
段(Paragraph) (可以看作是空行) <p>
你好吗?<p>很好。
你好吗?


很好。

换行 <br>
你好吗?<br>很好。
你好吗?
很好。

不换行<nobr>
<nobr>
请改变您浏览器窗口的宽度, 使之小于这一行的宽度, 看看这个标记的作用!
</nobr>
请改变您浏览器窗口的宽度,使之小于这一行的宽度,看看这个标记的作用!

文字的对齐(Alignment)
<hn align=#>...</hn>
<p align=#>...</p> #=left, center, right
<h3 align=center>Hello<\h3>
<h3 align=right>Hello<\h3>
Hello
Hello
<center>...</center>
<center>Hello</center>
Hello

文字的分区(Division)显示
<div align=left> ... </div>
<div align=left>
Can you feel happiness without unpleasant? <br>
Please show me your smile.
</div>

Can you feel happiness without unpleasant?
Please show me your smile.

<div align=center> ... </div>
Can you feel happiness without unpleasant?
Please show me your smile.

<div align=right> ... </div>
Can you feel happiness without unpleasant?
Please show me your smile.

列表
无序列表 <ul><li>...</ul>
<ul>
<li>Today
<li>Tommorow
</ul>
Today
Tommorow
有序列表 <ol><li>...</ol>
<ol>
<li>Today
<li>Tommorow
</ol>
Today
Tommorow
定义列表(Definition lists) <dl><dt>...<dd>...</dl>
<dl>
<dt>Today
<dd>Today is yesterday.
<dt>Tomorrow
<dd>Tomorrow is today.
</dl>
Today
Today will be yesterday.
Tomorrow
Tomorrow will be today.
Definition lists Compact <dl compact><dt>...<dd>...</dl>
Today
Today will be yesterday.
Next
Tomorrow will be today.  <dl compact>
<dt>Today
<dd>Today is yesterday.
<dt>Tomorrow
<dd>Tomorrow is today.
</dl> 

定制列表元素
定制表中的标记 <li type=#> #=disk, circle, square
<ul>
<li type=disc>ONE
<li type=circle>TWO
<li type=square>THREE
</ul>
ONE
TWO
THREE
定制有序列表表中的序号 <li type=#> #=A, a, I, i, 1
<ol><li type=A>ONE-ONE
<li>ONE-TWO</ol>
ONE-ONE
ONE-TWO
<ol><li type=a>ONE-ONE
<li>ONE-TWO</ol>
ONE-ONE
ONE-TWO
<ol><li type=I>ONE-ONE
<li>ONE-TWO</ol>
ONE-ONE
ONE-TWO
<ol><li type=i>ONE-ONE
<li>ONE-TWO</ol>
ONE-ONE
ONE-TWO
<ol><li type=1>ONE-ONE
<li>ONE-TWO</ol>
ONE-ONE
ONE-TWO
定制有序列表表中的序号的起始值 <ol start=#> #=number
<ol start=5>

<li type=A>ONE-ONE

<li>ONE-TWO

        <ol start=10>

        <li>TWO-ONE

        <li type=i>TWO-TWO

</ol></ol>

 


ONE-ONE
ONE-TWO
TWO-ONE
TWO-TWO
预格式化文本(Preformatted Text)
<pre>...</pre>
<pre>
Please use your card.
VISA Master
<b>Here is an order form.</b>
<ul><li>Fax
<li>Air Mail</ul>
</pre>
Please use your card

VISA    Master

Here is an order form.

Fax
Air Mail
<listing>...</listing>
<listing>
Please use your card.
VISA Master
<b>Here is an order form.</b>
<ul><li>Fax
<li>Air Mail</ul>
</listing>
Please use your card.

VISA    Master

Here is order form.

Fax
Air Mail
<xmp>...</xmp>
<xmp>
Please use your card.
VISA Master
<b>Here is an order form.</b>
<ul><li>Fax
<li>Air Mail</ul>
</xmp>
Please use your card.

VISA    Master

<b>Here is order form.</b>

<ul><li>Fax

<li>Air Mail</ul>空白(Spacer) <spacer type="horizontal" size=#> #=水平空白宽度
<spacer type="vertical" size=#> #=竖直空白高度
YESTERDAY <spacer type="horizontal" size=50> TODAY
<spacer type="vertical" size=50> TOMORROW
YESTERDAY TODAY TOMORROW

<spacer type="block" width=# height=# align=##>
#=空白的尺寸
##=top, middle, bottom, left, right

<spacer type="block" width=150 height=50 align=left>
YESTERDAY<br> TODAY<br> TOMORROW
YESTERDAY
TODAY
TOMORROW

多列文本

<multicol cols=#> ... </multicol> #=列的数目

<multicol cols=2> text text text... </multicol>

 

本文作者:



相关阅读:
SQL Server 2008的新压缩特性
javascript 通过封装div方式弹出div窗体
对象无length属性时IE6/IE7中无法将其转换成伪数组(ArrayLike)
javascript flash下fromCharCode和charCodeAt方法使用说明
IIS 错误代码大汇总
win98在安全模式下使用光驱的技巧
响应式网页设计:国外的很赞的响应式网页设计案例
什么是 WML?
NTLDR文件丢失
Js 打字效果 逐一出现的文字
html表单上传文件的“浏览”按钮修改方法
技巧:使用Emacs+Cscope来阅读代码
ORACLE数据库中EXPLAIN PLAN的心得
js定时显示广告的实现代码[已测]
快速导航

Copyright © 2016 phpStudy | 皖ICP备18014864号-4