转至繁体中文版     | 网站首页 | 图文教程 | 资源下载 | 站长博客 | 图片素材 | 武汉seo | 武汉网站优化 | 
最新公告:     敏韬网|教学资源学习资料永久免费分享站!  [mintao  2008年9月2日]        
您现在的位置: 学习笔记 >> 图文教程 >> 站长学院 >> 网页制作 >> 正文
3.4 文字对齐及缩行         ★★★★

3.4 文字对齐及缩行

作者:闵涛 文章来源:闵涛的学习笔记 点击数:692 更新时间:2009/4/23 13:47:36

现在我们谈谈段落及图象的对齐和加入段落缩行。


文字对齐


利用文字对齐属性,你可以控制段落的水平对齐:

    H4 { text-align: center }


这项属性只用于整块的内容,如<P>、 <H1>-<H6>、<BLOCKQUOTE>和 <UL>。


以下为各种选项:


left指将要素左对齐,如本段所示。


right指将要素右对齐,如本段所


示。


center指将要素居中,如本段所示。


justify指将要素左右对齐,如本段所示。justify 属性可用于Communicator(两种操作平台)及IE 4 (Windows版), 但不能用于MAC机的IE 3或IE 4。


截止现在,我们所谈到的只是将CSS用于文字,但CSS 的属性页可以用于其它替代要素(替代要素指用其它内容代替了的要素,图象是最常用的替代内容,还有Java applets,QuickTime movies和其它内容。)


所以我们可以将图象右对齐,如下所示:


day3_page4b.gif (1589 bytes)


(如果你将样式表属性直接加到<IMG>之上,Communicator有时候可能会捣乱。为了安抚它的这种驴脾气,你可以将<IMG>包含在<SPAN>或<DIV>之内,然后将样式表加到<SPAN>或<DIV>上,最好是加在<DIV>上,因为IE 4有时候对于联结到<SPAN>上的样式会闹一点小性子。


垂直对齐


目前浏览器根本还不能支持初衷对齐属性,但愿5.0版的浏览器能够做到这一点。

    H4 { vertical-align: top }


垂直对齐可以使你控制文字或替代要素(比如图象)相对于其母体要素的的垂直位置。例如,如果你将一个2x2象素的GIF图象同其母体要素文字的顶部垂直对齐,则该GIF图象将在该行文字的顶部显示。


以下为各项参数:

  • top将要素顶部同最高的母体要素对齐。
  • bottom将要素的底部同最低的母体要素对齐。 
  • text-top将要素的顶部同母体要素文字的顶部对齐。
  • text-bottom将要素的底部同母体要素文字的底部对齐。
  • baseline将要素的基准线同母体要素的基准线对齐。
  • middle将要素的中点同母体要素的中点对齐。
  • sub将要素以下标的形式显示。
  • super将要素以 上标的形式显示。

目前只有IE 4能支持这项属性,它支持最后的两项参数。


文字缩行


你想使段落缩行吗?(在Internet上呆一段时间之后,你可能已经忘了缩行是怎么一回事!)

    P { text-indent: 2em }

    在本段中你就可以看到缩行的应用。该属性只应用于整块的内容。你可以使用任何一种熟悉的长度单位设定缩行。

    你还可以使用比例参数。例如,本段的缩行为40%的比例,即本段的第1行的起始位置比其正常位置缩进了40%。

    (Windows版的IE 4假定比例指相对于整个浏览器窗口。而不是指段落的宽度)如果你将文字缩行赋予一个负值,则文字第1行的起始位置比其正常位置还偏左。

    本段的文字缩行赋值为-10象素。IE 4对这项属性不太适应,它有可能不显示最初的几个字母。

    充分运用你的缩行威力吧,年轻的杰地战士!



[VB.NET程序]3.4 - [basic.lookup] - 【基本.查找】  [网页制作]Ultradev实例教程:3.4 向数据库添加纪录
教程录入:mintao    责任编辑:mintao 
  • 上一篇教程:

  • 下一篇教程:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
      注:本站部分文章源于互联网,版权归原作者所有!如有侵权,请原作者与本站联系,本站将立即删除! 本站文章除特别注明外均可转载,但需注明出处! [MinTao学以致用网]
      网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)

    同类栏目
    · Web开发  · 网页制作
    · 平面设计  · 网站运营
    · 网站推广  · 搜索优化
    · 建站心得  · 站长故事
    · 互联动态
    更多内容
    热门推荐 更多内容
  • 没有教程
  • 赞助链接
    更多内容
    闵涛博文 更多关于武汉SEO的内容
    500 - 内部服务器错误。

    500 - 内部服务器错误。

    您查找的资源存在问题,因而无法显示。

    | 设为首页 |加入收藏 | 联系站长 | 友情链接 | 版权申明 | 广告服务
    MinTao学以致用网

    Copyright @ 2007-2012 敏韬网(敏而好学,文韬武略--MinTao.Net)(学习笔记) Inc All Rights Reserved.
    闵涛 投放广告、内容合作请Q我! E_mail:admin@mintao.net(欢迎提供学习资源)

    站长:MinTao ICP备案号:鄂ICP备11006601号-18

    闵涛站盟:医药大全-武穴网A打造BCD……
    咸宁网络警察报警平台