CSS样式表学习笔记

1、保持在一行float:left;
2、充满整个页面不约定width
3、<link rel=stylesheet href="font.css" type="text/css">
4、左边间距padding-left:100px;
5、字体颜色color:Blue;
6、背景颜色background-color:Black ;
7、注释/*留言样式*/

 

8、控制换行

<style type="text/css">
.huanhang{ width:80%; margin:0 auto;}
.clear{ width:0; height:0; font-size:0; line-height:0; padding:0; margin:0; clear:both;}
.tg{ width:30%; margin:10px; float:left;}

</style>

 

定义宽度TG

换行时清除

 

<div  class='huanhang'>

    <div class="tg">
           <div>团购专区</div>
            <div>支持付款方式： 支付宝支付 货到付款</div>
          <div>2011-4-6 17:18:26</div>
          <div> 支付宝支付 货到付款</div>
          <div>3</div>
          <div height=200>即将开始:<iframe src='daojishi.aspx?id=3'  align='absmiddle' allowTransparency='true' scrolling='no'  border='0' frameborder='0' width=180 height=30></iframe>  </div>
          <div><a href='show_cms.aspx?channelid=8&ID=1395' target=_blank>点此查看商品</a></div>
    </div>

     <div class="tg">
           <div>团购专区</div>
           <div>支持付款方式： 银行在线支付</div>
          <div>2011-4-6 17:18:26</div>
          <div> 银行在线支付</div>
          <div>2</div>
          <div height=200>已经结束</div>
          <div><a href='show_cms.aspx?channelid=8&ID=1394' target=_blank>点此查看商品</a></div>
    </div>

</div>

<div  class='clear'></div>

<div  class='huanhang'>

 

          <div class="tg">
                    <div>团购专区</div>
                    <div>支持付款方式： 银行在线支付 支付宝支付 货到付款</div>
                    <div>2011-4-6 17:18:26</div>
                    <div> 银行在线支付 支付宝支付 货到付款</div>
                    <div>1</div>
                    <div height=200>剩余时间:<iframe src='daojishi.aspx?id=1'  align='absmiddle' allowTransparency='true' scrolling='no'  border='0' frameborder='0' width=180 height=30></iframe>  </div>
                    <div><a href='show_cms.aspx?channelid=8&ID=1393' target=_blank>点此查看商品</a></div>
          </div>

</div>