|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。
网页制造poluoluo文章简介:别看有的东东长得个表格样,实际上是披着表格皮的无序列表,为了巨大的语义,我们必要用CSS完成表分外不雅的无序列表。
- 介入测试的扫瞄器:IE6/IE7/IE8/FF3/OP9.6/SF3/Chrome2
- 操纵体系:Windows
- 出格提醒:这不是表格的摹拟。表格不管在语义、布局,仍是在效果完成上,都是没法替换的。本文只针对无序列表在表面方面的一个特别需求
别看有的东东长得个表格样,实际上是披着表格皮的无序列表,为了巨大的语义,我们必要用css完成表分外不雅的无序列表。
团体喜欢,这里接纳border和negativemargin来完成,十分复杂:
运转代码框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><metaname="author"content="Chomo"/><linkrel="start"href="http://www.14px.com"title="Home"/><title>表分外不雅的无序列表-原始形态</title><styletype="text/css">*{margin:0;padding:0;list-style:none;}ul{margin-left:1px;margin-top:1px;width:505px;}li{float:left;height:23px;border:1pxsolid#cfdae8;width:100px;margin-left:-1px;margin-top:-1px;}</style></head><body><ul><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li></ul><br/><br/>像一个表格吧?^-^</body></html>
[Ctrl+A全体选择提醒:你可先修正部分代码,再按运转]
这是一个最复杂的模子,但是,实战老是严酷的:
- 宽度怎样自顺应分辩率?
- 单位格内容过量、构成换行怎样处置?
- 最纠结的成绩:5
|
|