學習CSS必讀

2021-10-09 20:39:39 字數 2520 閱讀 6012

發展過程 版本

說明css1

2023年12月,層疊樣式表的第乙份正式標準(csscading style sheets level 1)完成,稱為w3c的推薦標準

css2

2023年初,w3c組織負責css的工作組開始討論第一版中沒有涉及到的問題。其中討論結果組成了2023年5月出版的css規範第二版

css3

css 3 是 css層疊樣式表技術的公升級版本,與2023年開始制訂,2023年5月23日w3c完成了css3的工作草案,主要包括盒子模型、列表模組、超連結方式、語言模組、背景和邊框、文字特效、多欄布局等模組

css作用

前端三層技術

css的出現,實現了網頁的結構和樣式分離,拯救了混亂的html,更加拯救了我們的web開發者

沒有css的網頁我們也可以讀取到資訊,但是視覺效果將會出現毀滅式的崩塌

css的組成

樣式

p

書寫位置

內聯式

"width: 100px; height="

"200px; font-size: 14px">

內聯式缺點

因此,實際工作中不會使用內聯式(行內式)編寫css**

內嵌式特點

缺點 書寫語法:

注意:

外聯式引用

屬性名屬性值說明

rel「stylesheet」

表示引入的外部檔案與html之間的關係,樣式表

href

css檔案路徑

hypertext reference,超文字引用

type

「text/css」

表示載入時**按照純文字形式的css**載入。html5中可以省略type屬性不寫

"stylesheet" href="xl.css" type="text/css">

匯入方式:

匯入式問題

實際應用

樣式規則

注意事項

乙個清晰易讀的css**,離不開css注釋的合理新增

快捷鍵

**風格是實際開發中的書寫方式,並非強制標準

英文大小寫

空格規範

顏色值

十六進製制模式

英文

如果不設定字型屬性,不同瀏覽器有自己的預設字型

注意事項

實際應用中

相對長度單位

說明px

畫素值,最常使用的單位

em倍數,繼承自祖先元素設定的字型大小的倍數

%百分比,整合自祖先元素設定的字型大小的百分比

絕對長度單位

說明in

英吋cm

厘公尺mm

公釐pt點

實際應用

如果想在瀏覽器中具體看到乙個盒子占有的實際位置,需要設定盒子可以實體化的三屬性

屬性名屬性值說明

width

px單位的數值

定義元素占有的寬度

height

px單位的數值

定義元素占有的高度

background-color

顏色名、顏色值

定義元素的背景顏色

在內嵌式和外部css中,要想將css樣式應用於特定的html元素,首先需要找到該目標元素,這時需要用到css中的選擇器

標籤選擇器

類選擇器的特殊應用

類選擇器的優點

實際工作中,通常我們有乙個使用規律:類上樣式(css)id上行為(js)

由於基礎選擇器不能實現所有選擇情況,後期再基礎選擇器的基礎上衍生出了幾種高階選擇器。高階選擇器的組成部分是基礎選擇器

/* div ul li p  */

div p

p.list

"list">333

"list">444

555666

p.list.do

"list">333

"list do">444

555666

p,span

"list">333

"list do">444

555666

css的概念中,除了前面提到的樣式外,還有乙個重要的概念就是層疊式,層疊式是貫穿整個css的乙個性質,包含繼承性和層疊性

選中目標標籤的祖先級

important

行內式

選中目標標籤

!important關鍵字

行內式權重

高效工作學習必讀

一 關於智力的一些常識 智力的主要表現形式 認識能力 行為 能力 智力的四種主要因素 觀察力 記憶力 思維力 想象力 觀察力,是有目的 有計畫地覺知事物的能力,人們通過觀察主動自覺地獲取資訊。記憶力,是對過去經理過的事物包括感知過的事物 思考過的問題 體驗過的情緒情感以及操作過的動作等的放應能力,人...

學習設計模式前必讀

個人總結 設計模式 最熟悉的陌生人。很多人應該都有這種感受,早就知道設計模式,也能隨口說出幾種,但是不知道每種是怎麼回事。或者說只知道工廠模式等幾個常用,簡單的。估計那也是靠記憶,而不是真正的理解。我也有這種親身體會,在好幾年之前就知道設計模式。之前也一直抽時間學,但總是學了就忘。而且學習過程很枯燥...

學習C 高階必讀書目

紅色為必讀書目 1.c 語言的設計和演化 首先肯定要讀一讀 bjarne stroustrup 的the design and evolution of c 了解一下這個語言的歷史。接下來就可以看別的書了,但要不停地回頭看這本書,看到 你不斷地學到的新技術是怎麼樣一點點地被接納到這個語言中去的。2....