网站建设 | 网站设计 | 商务 | 资讯 | 知识 | 课堂 | 短信 | 健康 | 游戏 | 搜索 | 社区 | 热点 | 博客 | 鲜花 | 留学
建站知识 | 企业品牌 | 标志设计 | 网络营销 | 网站优化 | 企业营销 | 宣传 | 动画 | 建站 | 推广 | 制作 | 招聘
关于七彩 | 联系我们 | 画册 | 商机 | 教程 | 建网站 | 多媒体 | 宣传片 | FLASH | 情人节 | 祝福语 | 毛尖茶
服务中心 建立网站 建站方案 网页设计 网站建设 网站改版 网站推广 客户案例
七彩课堂教程
平面设计教程
网页设计教程
网页制作教程
网站建设教程
网站推广教程
网站运营教程
广告设计教程
网络知识教程
网页标准教程
Asp.Net教程
Dreamweaver
动画制作教程
合作支持
英国留学 | 工艺品 | 商标注册 | Spa水疗设备 | 卓迈国际 | 打包带 | 杭州鲜花 | 搞笑短信 | 情人节鲜花 | Nike Shoes
课堂快速通道
网页设计: 01 02 03 04
平面设计: 01 02 03 04
网站推广: 01 02 03 04
网站建设: 01 02 03 04
网页制作: 01 02 03 04
动画教程: 01 02 03 04
建站知识: 01 02 03 04
>>>> 查看更多
   
七彩课堂[企业建站知识系列]
display: none和visibility: hidden不同之处
处理HTML元素最关键的一个窍门,没有任何特别的,就是理解他们是如何工作的。大部分页面都可以使用一点点的标签组合起来,你可以为每一个你选定的标签样式化。浏览器默认的可视化样式元素由变化的字体样式、边界、补白和,和重要的,显示类型。

最基本的显示类型是内联inline、块block和清除none,他们分别可以用inline、block和none的值赋予display属性来操作。

inline就如本身语义所明示的,显示随着行流动的元素。锚和强调元素都是传统的内联元素。

block使元素前后都有断行。标题和段落元素都是传统的块元素的例子。

none,嗯,不显示这个元素,听起来毫无用处,但于易用性考虑(请看亲和连接),改变样式表,或者高级的翻转效果都有很好的用途。

比如这个站点的默认原始版本,通过操纵一些传统的内联和块元素来适应设计。

h1 { display: inline; font-size: 2em; } #header p { display: inline; font-size: 0.9em; padding-left: 2em; }
这使得“htmldog.com”的标题和标签行可以并排,而不是一上一下,维护最优的易用性。

#navigation, #seeAlso, #comments, #standards { display: none; }
上述代码使用在打印样式中,用于“关闭”这些元素,比如,对于一个单一的页面导航通常是不必须的。

注意
display: none和visibility: hidden不同之处在于display: none使元素完全是个死球,然而visibility: hidden虽不出现在内容中但保留着这个元素的流位置。比如,如果三段中的第二端设为display: none,第一段会直接到达第三段,而设为visibility: hidden的话,这个段落会有一个间隔。

表格
也许理解表格相关的显示属性值的最好方法是关心HTML表格。table是初始化的显示,你可以用tr和td分别摹拟table-row和table-cell值。

display属性走得更远,提供table-column、table-row-group、table-column-group、table-header-group、table-footer-group和table-caption的值, 都是自描述的。这些值显而易见的好处是,你可以用列来构造表格,代替有偏见的row。

最后,inline-table设置前后不断行的表格。

注意
对CSS表格失去控制的话,可能严重的损害你网页的亲和力(易用性)。HTML应该用来传达内容的,所以你有表格式数据的话,你应该用HTML表格来安排它们。使用CSS表格仅仅能给数据调调味,如果没有CSS的话完全不可读。十分不好。别走Michael Jackson的路。

其他显示类型
list-item也是自描述的,一般以列表的形式显示,使用在除li的HTML元素上。为了显示正确,使用这个显示类型的应该嵌套在ul或者ol元素内。

run-in使元素内联或块显示,取决于其父元素的的显示属性。在IE和基于Mozilla的浏览器中都不能工作。

campact也使元素内联或者块显示,同样取决于上下文。它也不能很好工作。

marker仅仅是与:before和:after伪元素一起来定义content属性的值。content属性的自动值已经是marker,所以这只对覆盖掉前面的content的显示属性有用。

七彩课堂推荐教程
网页设计|七彩资讯|MTV欣赏|幽默动画|网站赚钱|祝福短信|搞笑短信|春节祝福|爱情短信|情人短信|节日来历
七彩社区|鲜花联盟|平面设计|广告设计|CSS教程|ASP教程|职场|诚信|企业|商务|采购|加盟|供应|信息库
家庭医生|心理|纤体|育儿|耳鸣|中医|癌症|Google|AdSense|English|祝福|短信息|网站地图|加入收藏
2005 -2007© Copyright QicaiSpace.com All rights receand. [七彩空间专业建网站做网站].
电话/TEL: 13396526989  传真/FAX: 0571 -- 63136250    E-mail: art01@163.com