• 紫光阁中共中央国家机关工作委员会 2020-02-23
  • 看见什么有用?[猜想] 2020-02-23
  • 中办印发《关于进一步激励广大干部新时代新担当新作为的意见》 2019-09-07
  • 一条塔里木河 串起南疆各色景致与无限风光 2019-09-07
  • 【互动话题】我为两会建言献策 2019-07-18
  • 还是中国足球队最牛,因为他稳定;中国股市就不一样了,怎么形容呢?唉,还不如中国足球! 2019-07-18
  • 新生代农民工市民化与城镇化发展 2019-07-04
  • 习近平应约同俄罗斯总统普京通电话 2019-07-02
  • 中粮集团混改再按“快进键” 2019-07-02
  • 人的本质,要能反映出人与动物的本质不同。过去有个网友说“劳动是人的本质”;真理先生现说是“财富占有”!???,能解释一下么? 2019-06-30
  • [鄙视]又一个“风水帖”。深坛什么时候成了“算命平台”了?!这些伪公知砖家不深入农村了解农民,凭一点表象就信口开河,“辛苦劳作的农民没有富起来”是这“4点原因” 2019-06-22
  • 击鼓-热门标签-华商生活 2019-06-22
  • 河北定州:秸秆回收变废为宝 2019-05-14
  • 妹妹半个多世纪前嫁到安徽 八旬老人想再见她一面 2019-05-14
  • 在这里,读懂2017——人民日报十大评论文章 2019-05-14
  • 欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!

    良多网页机关时分小一小部分布局除了应用其余标签来组织,对span标签决议使用也是不错选择。这里CSS5举一个小实例简介span组织小构造运用。

    例如文章题目列表中,左边为问题,右边为对应颁布发表时间,造成摆布结构的机关,何等小一小部分假设决定div构造就大材小用了。

    1)、span浸染实例代码

    <!DOCTYPE html> 
    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>span 实例 CSS5</title> 
    <style> 
    ul,li{ padding:0; margin:0;list-style:none; } 
    ul{ width:400px; padding:10px;border:1px solid #000} 
    ul li{ line-height:30px; height:30px; text-align:left} 
    ul li a{ float:left; width:300px; height:30px; overflow:hidden} 
    ul li span{ float:right} 
    </style> 
    </head> 
    <body> 
    <ul> 
    <li><a href="#">文章问题表现</a><span>2016-09-11</span></li> 
    <li><a href="#">接待会见CSS5web</a><span>2016-05-07</span></li> 
    </ul> 
    </body> 
    </html> 
    

    代码疏解:

    ul,li{ padding:0; margin:0;list-style:none; }
    

    肯定ul和li默认CSS格局,比喻li后背间隔与无序圆点功效

    ul{ width:400px; padding:10px;border:1px solid #000}
    

    便于观测功效对ul配置宽度与边框,设置padding防备模式与Ul太紧贴。

    ul li{ line-height:30px; height:30px; text-align:left}
    

    配置Li高度,和内容垂直居中,设置形式靠左浮现

    ul li a{ float:left; width:300px; height:30px; overflow:hidden}
    

    对li里的li a设置靠左浮动,设置装备摆设宽度与高度,以及设置装备摆设匿伏横跨宽度高度的内容。防备形式溢出

    ul li span{ float:right}
    

    对span设置装备摆设靠右浮动

    这样完成了文章列表结构中,标题问题靠左,年光靠右。

    如需转载,请注明文章出处和来源网址:http://www.cuhw.com.cn/wenji/w53769.shtml

  • 紫光阁中共中央国家机关工作委员会 2020-02-23
  • 看见什么有用?[猜想] 2020-02-23
  • 中办印发《关于进一步激励广大干部新时代新担当新作为的意见》 2019-09-07
  • 一条塔里木河 串起南疆各色景致与无限风光 2019-09-07
  • 【互动话题】我为两会建言献策 2019-07-18
  • 还是中国足球队最牛,因为他稳定;中国股市就不一样了,怎么形容呢?唉,还不如中国足球! 2019-07-18
  • 新生代农民工市民化与城镇化发展 2019-07-04
  • 习近平应约同俄罗斯总统普京通电话 2019-07-02
  • 中粮集团混改再按“快进键” 2019-07-02
  • 人的本质,要能反映出人与动物的本质不同。过去有个网友说“劳动是人的本质”;真理先生现说是“财富占有”!???,能解释一下么? 2019-06-30
  • [鄙视]又一个“风水帖”。深坛什么时候成了“算命平台”了?!这些伪公知砖家不深入农村了解农民,凭一点表象就信口开河,“辛苦劳作的农民没有富起来”是这“4点原因” 2019-06-22
  • 击鼓-热门标签-华商生活 2019-06-22
  • 河北定州:秸秆回收变废为宝 2019-05-14
  • 妹妹半个多世纪前嫁到安徽 八旬老人想再见她一面 2019-05-14
  • 在这里,读懂2017——人民日报十大评论文章 2019-05-14