|
|
马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
您需要 登录 才可以下载或查看，没有帐号？立即注册
x
Table布局灵活性不大，你只能遵循tabletrtd的格式。而div你可以divulli也可以olli还可以ulli……但标准语法最好有序的写。
破洛洛文章简介：用到的CSS属性值：inline-block:将工具呈递为内联工具，可是工具的内容作为块工具呈递。中间的内联工具会被呈递在统一行内就如许，完善的图文居中显现就做出来了。是否是很惊异？现实告知我们，公道的使用CSS既可完成一些仿佛不太大概的效果。
事情中常常会碰到一个图文的效果，如图：
再罕见不外的效果了，关于上面的笔墨，一样平常我们的处置体例是居中，但笔墨多了会怎样办呢？有人会回覆“埋没”；也有人会回覆“换行”。
关于“换行”的处置办法我们会碰到一个成绩，假如是笔墨居中，那第二行也会居中，如许就会形成一种不友爱的体现效果。
那末有无一种办法能够针对第一行的笔墨完成居中，第二行的笔墨完成居左显现呢?
请看：
运转代码框
<!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"/><metahttp-equiv="X-UA-Compatible"content="IE=EmulateIE7"/><title>demo</title><linktype="text/css"href="http://wkaifang.com/demo/css/reset.css"rel="stylesheet"media="screen"/><styletype="text/css">.demoli{display:inline;float:left;width:100px;text-align:center;margin:10px;}.demoliimg{display:block;}.demolistrong{display:inline-block;text-align:left;}.demolistronga{text-align:left;}</style></head><bodyonload="document.execCommand(BackgroundImageCache,false,true)"><ulclass="demo"><li><ahref="#">我是居中的</a></strong></li></ul></body></html>
[Ctrl+A全体选择提醒：你可先修正部分代码，再按运转]
CSS以下：
.demoli{display:inline;float:left;width:100px;text-align:center;margin:10px;}
.demoliimg{display:block;}
.demolistrong{display:inline-block;text-align:left;}
.demolistronga{text-align:left;}
HTML以下：
<ul>
<li><ahref=”#”></a><strong><ahref=”#”>我是居中的</a></strong></li>
</ul>
用到的CSS属性值：inline-block:将工具呈递为内联工具，可是工具的内容作为块工具呈递。中间的内联工具会被呈递在统一行内就如许，完善的图文居中显现就做出来了。是否是很惊异？现实告知我们，公道的使用CSS既可完成一些仿佛不太大概的效果。
</p>
层叠样式表（CascadingStyleSheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。 |
|
|Archiver|手机版|仓酷云
鄂ICP备14007578号-2
发表于 2015-1-15 23:16:04
收藏
转播
分享
淘帖
顶
踩
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜
窥视卡
雷达卡
发表于 2015-2-11 08:08:12