文字的布局关系到一篇文章在网页中的美观与否,本文主要讲解HTML的布局标记。
1、行的控制
(1)换行控制
在《常用HTML标记和格式》中已经介绍过强制换行符<br>,表示一个段落中间另起一行。一个<br>标记表示换一行,如果在一行文字中出现多次<br>,就会换行多次。
同样,在《常用HTML标记和格式》中已经介绍过的段落标记<p></p>,也可以单独使用<p>,用作换行使用。换行<p>和强制换行<br>的区别在于,<p>换行中间会空一行,<br>不会空一行。
(2)不换行控制
格式:<nobr>菁瑞优智</nobr>
该标记中的文字,不会换行,不管有多长,都在一行里显示。不换行控制在实际中不会经常用到。
2、文字对齐
文字对齐很重要,是一种经常用到的文字布局方式。
语法:align="#"
#可以为left(向左)、right(向右)、center(居中)。
align需要配合<p></p>、<div></div>(后面会学到)等使用,表示文字在标记中向某个方向偏移,当然,除了文字,图片也是可以的。
如文字右对齐:<p align="right">菁瑞优智</p>
cener可不用align关键字,进行居中处理
<center>菁瑞优智</center>
3、列表
列表分为有序列表和无序列表。我们在浏览网页新闻时,有的新闻列表标题前是一个小圆点,这种表示无序列表,而有的标题前是有序的数字,这种表示有序的列表。
(1)无序列表
<ul>
<li>表项一</li>
<li>表项二</li>
<li>表项三</li>
</ul>
(2)有序列表
<ol>
<li>表项一</li>
<li>表项二</li>
<li>表项三</li>
</ol>
通过上面代码可以看出,决定无序的是<ul>,决定有序的是<ol>,而<li>只是里面的列表项,如果想列出更多的列表项,那么就在里面添加多个<li>即可。
4、 制作滚动文字
通过前面的学习,相信大家已经能够很好地控制各种段落文字的显示方式,不过无论怎么设置,文字都是静态的。那怎样让文字动起来呢?
(1)设置文字滚动
格式:<marquee>菁瑞优智</marquee>
默认从右到左,循环滚动。
(2)设置文字滚动方向
格式:<marquee direction=“#”>菁瑞优智</marquee>
direction属性用于设置内容的滚动方向,#表示方向,属性值有left(向左)、right(向右)、up(向上)、down(向下)。
(3)设置文字滚动的速度和形式
scrollamount:用于设置内容滚动速度。
behavior:用于设置内容滚动方式,默认为scroll,即循环滚动。当其值为alternate时,内容将来回循环滚动;当其值为slide时,内容滚动一次即停止,不会循环。还有一个loop属性可设置其滚动循环次数,默认为没有限制。
scrolldelay:用于设置内容滚动的时间间隔。
bgcolor:用于设置内容滚动背景色(类似于body的背景色设置)。
width:用于设置内容滚动背景宽度。
height:用于设置内容滚动背景高度。