CSS3学习笔记(4)-CSS3函数
1
2
3
4
1 <style><!-- 2 .col-3{ 3 width: calc(100%/3 - 6px); 4 float: left; 5 margin-right: calc(6px*3 /2); 6 background: #fff; 7 color: #333; 8 height: 100px; 9 text-align: center; 10 margin-bottom: calc(6px*3 /2); 11 font-size: 18px; 12 line-height: 100px; 13 box-shadow:0 0 10px; 14 } 15 .col-3:nth-child(3){ 16 margin-right: 0; 17 } 18 .container{ 19 overflow:hidden; 20 } 21 .alexrootdiv{ 22 font-family: 微软雅黑; 23 margin: 0; 24 padding: 0; 25 } 26 .alexrootdiv>p{ 27 font-size: 15px; text-indent: 2em; 28 } 29 .alexrootdiv>div{ 30 background: #eeeeee; border: 1px solid #aaa; 31 width: 99%; padding: 5px; margin: 1em 0 1em 0; 32 } 33 .alexrootdiv>div>p:first-of-type,.alextitlep{ 34 font-size: 18px; font-weight: bold; color: red; 35 } 36 .alexrootdiv span{ 37 color:blue;font-weight:bold; 38 } 39 .alexrootdiv table{ 40 margin-top:10px;border-collapse:collapse; 41 border:1px solid #aaa;width:100%; 42 } 43 .alexrootdiv table th{ 44 vertical-align:baseline;padding:5px 15px 5px 6px; 45 background-color:#d5d5d5;border:1px solid #aaa;text-align:left; 46 } 47 .alexrootdiv table td{ 48 vertical-align:text-top;padding:6px 15px 6px 6px; 49 background-color:#efefef;border:1px solid #aaa; 50 } 51 .attentationp{ 52 font-size: 15px; text-indent: 2em; 53 background: #ee0; color: red; font-weight: bold; 54 } 55 --></style> 56 <div class="alexrootdiv"> 57 <div class="container"> 58 <div class="col-3">1</div> 59 <div class="col-3">2</div> 60 <div class="col-3">3</div> 61 <div class="col-3">4</div> 62 </div> 63 </div>