1. 程式人生 > >前端基礎02 CSS

前端基礎02 CSS

family utf-8 Language lin -html 前端基礎 ria 嵌入 組合選擇器

CSS的幾種引入方式

行內樣式

行內式是在標記的style屬性中設定CSS樣式。不推薦大規模使用。

<p style="color: red">Hello world.</p>

內部樣式

嵌入式是將CSS樣式集中寫在網頁的<head></head>標簽對的<style></style>標簽對中。格式如下:

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        p{
            background-color: #2b99ff;
        }
    </style>
</head>

外部樣式

外部樣式就是將css寫在一個單獨的文件中,然後在頁面進行引入即可。推薦使用此方式。

<link href="mystyle.css" rel="stylesheet" type="text/css"/>

CSS選擇器

基本選擇器

  1. 元素選擇器
    p {color: "red";}
  2. ID選擇器
    #i1 {
    background-color: red;
    }
  3. 類選擇器
    .c1 {
    font-size: 14px;
    }
    p.c1 {
    color: red;
    }