css和html結合的第一種方式:
1.每乙個html標籤都有乙個style樣式的屬性。該屬性的值就是css的**。
2.使用style標籤的方式。一般都定義在head中
3.使用css檔案匯入
4.使用html鏈結
demo1:
這是乙個div區域1
這是乙個div區域2
這是乙個span區域1
這是乙個span區域2
這是乙個段落1
這是乙個段落2
demo2:
@charset "utf-8";
div
@charset "utf-8";
p@charset "utf-8";
/* 在該檔案中匯入其他css檔案
*/ @import url("div.css");
@import url("span.css");
@import url("p.css");
這是乙個div區域1
這是乙個div區域2
這是乙個span區域1
這是乙個span區域2
這是乙個段落1
這是乙個段落2
選擇器:html選擇器有3種:
1.html標籤名選擇器。使用的是html的標籤名;
2.class類選擇器。使用的是標籤中的class屬性;
3.id選擇器。使用的是標籤中的id屬性。通常id的取值在頁面中是惟一的,因為該屬性除了給css使用,還給js使用,id通常是為了標記頁面中的一些特定區域使用的。
選擇器優先順序:標籤選擇器《類名選擇器
demo3:
這是乙個div區域1
這是乙個div區域2
這是乙個span區域1
這是乙個span區域2
這是乙個段落1
這是乙個段落2
擴充套件選擇器1.關聯選擇器:選擇器中的選擇器
標籤是可以巢狀的,要讓相同標籤的不同標籤顯示不同的樣式,就可以用此選擇器。
2.組合選擇器:
對多個選擇器進行相同樣式的設定時用它。
demo4:
這是乙個div區域1
這是乙個div區域2
這是乙個span區域1
這是一個span區域2
這是乙個段落1
這是乙個段落2
3.偽元素選擇器:
demo5:
偽元素選擇器演示
這是乙個段落
這是乙個div區域
這是乙個div區域
這是乙個div區域
demo6:
姓名:成績:div區域
單元格1
單元格1
單元格1
單元格1
單元格1
單元格1
盒子模式:
多少年以後,往事隨雲走,我們一直流連在貝加爾湖畔。
多少年以後,往事隨雲走,我們一直流連在貝加爾湖畔。
多少年以後,往事隨雲走,我們一直流連在貝加爾湖畔。
多少年以後,往事隨雲走,我們一直流連在貝加爾湖畔。
CSS學習 CSS學習筆記
出處 注 本學習筆記只是自己的一些備忘,初學者的東西不具有參考性,請到w3school 進行系統學習。學習css我使用的工具是visual css,可以實現同步預覽,快速學習編輯css。1.css的作用 用來規定網頁中的內容的顯示方式,避免給html增加很多的屬性而將 變得臃腫。2.css的應用方式...
CSS學習 CSS學習筆記
出處 注 本學習筆記只是自己的一些備忘,初學者的東西不具有參考性,請到w3school 進行系統學習。學習css我使用的工具是visual css,可以實現同步預覽,快速學習編輯css。1.css的作用 用來規定網頁中的內容的顯示方式,避免給html增加很多的屬性而將 變得臃腫。2.css的應用方式...
CSS 學習筆記
當同乙個html元素被不止乙個樣式定義時,會使用哪個樣式呢?一般而言,所有的樣式會根據下面的規則層疊於乙個新的虛擬樣式表中,其中數字4 擁有最高的優先權。1.瀏覽器預設設定 2.外部樣式表 3.內部樣式表 位於標籤內部 4.內聯樣式 在html 元素內部 因此,內聯樣式 在html 元素內部 擁有最...