線上書籍

Home

網站、部落格架設

一、CSS 参考手册

http://www.w3school.com.cn/cssref/index.asp

二、CSS 套用方式

  1. 行內套用 (Inline) <div class="container"> <div class="row" style="margin:20px"> <div class="col-md-4" style="background-color: #eee;border: 1px solid #ddd;">.col-md-4</div> <div class="col-md-4" style="background-color: #eee;border: 1px solid #ddd;">.col-md-4</div> <div class="col-md-4" style="background-color: #eee;border: 1px solid #ddd;">.col-md-4</div> </div> <div class="row" style="margin:20px"> <div class="col-md-4" style="background-color: #eee;border: 1px solid #ddd;">.col-md-4</div> <div class="col-md-4" style="background-color: #eee;border: 1px solid #ddd;">.col-md-4</div> <div class="col-md-4" style="background-color: #eee;border: 1px solid #ddd;">.col-md-4</div> </div> </div>
  2. 嵌入套用 (Embed) <style type="text/css"> .row { margin:20px; } [class*="col-"] { background-color: #eee; border: 1px solid #ddd; } </style> <div class="container"> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> </div>

     

  3. 外部連接套用 (External Link) <link rel="stylesheet" href="https://www.ugm.com.tw/themes/asia_one_page_3/assets/css/style.css">

     

匯入套用 (Import)

<STYLE TYPE="text/css"> <!-- @import url(http://https://www.ugm.com.tw/themes/asia_one_page_3/assets/css/style.css); --> </STYLE>

三、CSS 尺寸 (Dimension)

http://www.w3school.com.cn/css/css_dimension.asp