| Extra small <576px |
Small ≥576px |
Medium ≥768px |
Large ≥992px |
Extra large ≥1200px |
|
|---|---|---|---|---|---|
| Max container width | None (auto) | 540px | 720px | 960px | 1140px |
| Class prefix | .col- | .col-sm- | .col-md- | .col-lg- | .col-xl- |
<h1>新名錶新消息</h1>
<div class="container">
<div class="row">
<div class="col-12 col-md-5 col-lg-4"> 圖 </div>
<div class="col-12 col-md-7 col-lg-8"> 文 </div>
</div>
<div class="row">
<div class="col-12 col-md-7 col-lg-8"> 文 </div>
<div class="col-12 col-md-5 col-lg-4"> 圖 </div>
</div>
<div class="row">
<div class="col-12 col-md-5 col-lg-4"> 圖 </div>
<div class="col-12 col-md-7 col-lg-8"> 文 </div>
</div>
<div class="row">
<div class="col-12 col-md-7 col-lg-8"> 文 </div>
<div class="col-12 col-md-5 col-lg-4"> 圖 </div>
</div>
</div>
設計在手機版時,每一個.row的下方有橫線,除了最後一個.row的下方不要橫線。
設計 h2 標題文字的樣式。
設計 p 段落文字左右對齊。