仓酷云

标题: 给大家带来用css完成表分外不雅的无序列表 [打印本页]
作者: 乐观    时间: 2015-1-15 23:55
标题: 给大家带来用css完成表分外不雅的无序列表
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。
网页制造poluoluo文章简介：别看有的东东长得个表格样，实际上是披着表格皮的无序列表，为了巨大的语义，我们必要用css完成表分外不雅的无序列表。
别看有的东东长得个表格样，实际上是披着表格皮的无序列表，为了巨大的语义，我们必要用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全体选择提醒：你可先修正部分代码，再按运转]
这是一个最复杂的模子，但是，实战老是严酷的：