programlearned
  • Introduction
  • js 筆記
    • Hammer.js 應用
  • node 筆記
    • 安裝與開始
    • exports 的應用
    • http 模組知識
    • Express 開始
      • 載入靜態檔案(image,css,js)
      • ejs 的使用
      • ejs layout的使用
      • ejs include的使用
      • ejs-form 的使用
      • ejs-ajax 的使用
      • route 的整理使用
    • 參考資料
  • vue 筆記
    • 安裝與開始
    • 基礎知識
      • 創建vue與輸出
      • v-bind 綁訂應用
      • v-for 與 v-if
      • v-on
      • v-class
      • 計算功能函數
      • 表單資料綁定
      • TodoList製作
    • 參考資料
  • Bootstrap 筆記
    • 相關資源網站
    • 安裝與開始
    • CSS 基礎知識
    • 容器container 應用
    • 網格系統 應用
      • 斷點
      • 版本斷點比較
      • 欄位排序
      • 欄位推移
      • 巢狀欄位
      • Flexbox 方向性
    • 間隔工具
    • 按鈕(button)
    • 不同的呈現(display)方式
    • 容器對齊方式
    • 文字(背景顏色)對齊與樣式
    • 導覽列應用
    • 參考資源
  • gitbook 製作與離線版
Powered by GitBook
On this page

Was this helpful?

  1. Bootstrap 筆記

CSS 基礎知識

一、關於CSS

  • Bootstrap是一套CSS框架,簡單了解CSS用法是必要的

  • CSS:Cascading Style Sheets,簡稱CSS,中文通常稱為層疊樣式表或串接樣式表

  • 可用來替網頁上的各種元件設定其外觀

  • 套用樣式的三種方法:

行內樣式

內部頁面樣式

外部連結樣式

範圍

最小

頁中

許多頁

優先

最優先

用法

<標籤 style="CSS;">

<style type='text/css'> CSS; </style>

<link href="CSS檔.css" rel="stylesheet">

  • 頁面可同時套用數個css檔或設定,重複的以最後讀到的為主

  • 並可以用import來引入其他的CSS檔:如:@import url("my.css");

標籤挑選器

ID挑選器

類別挑選器

樣式表

p {CSS屬性: 值;}

#home{CSS屬性: 值;}

.row{CSS屬性: 值;}

網頁

<p></p>

<div id="home"></div>

<div class="row"></div>

  • 基本上,BootStrap就是一堆類別挑選器的組合

Previous安裝與開始Next容器container 應用

Last updated 6 years ago

Was this helpful?