前端學習之CSS入門

2021-10-10 18:38:38 字數 2034 閱讀 9781

這幾天正巧碰上好多事,只能斷斷續續的學習,並且確實也懈怠了不少。自學麼,總是會碰到各種問題的,不能全身心的投入到學習中去,進度也比較慢,更多的要靠自己的自控能力,所以說,沒有自制力的人還是要報班學習啊。而我呢,就是想挑戰下自己,並且鍛鍊下自己。加油吧!

用了快兩周多的時間才更新,下一步我要端正下自己的態度了!

以下是我css的學習筆記!

css學習筆記

css是層疊樣式表的簡稱,有時我們也會叫css樣式表或級聯樣式表。

css也是標記語言

css主要用於設定html頁面中的文字的大小,字型,樣式,對齊方式等,形狀以及頁面的布局和外觀顯示樣式。

css最大的價值是:由html專注去做結構呈現,樣式交給css,即結構html與樣式css相分離。

css由兩部分組成:選擇器以及一條或者多條宣告

語法規範

選擇器是用於指定css樣式的html標籤,花括號是對該物件設定的具體樣式

屬性與屬性值之間以「鍵對值」的形式出現

屬性是對指定物件設定的樣式屬性,例如字型大小,顏色等

屬性與屬性值之間用英文: 隔開

多個鍵對值之間用英文 ;  隔開

css選擇器的作用是用來選擇標籤的

選擇器可分為基礎選擇器和復合選擇器兩類

基礎選擇器是由單個選擇器組成

基礎選擇器包括:標籤選擇器,類選擇器,id選擇器和通配選擇器

標籤選擇器是指用html作為選擇器,按照標籤名稱分類,為頁面中的某一類標籤指定的統一的css樣式。

類選擇器可以單獨選乙個或某幾個標籤:結構需要用class屬性

變紅色

口訣:樣式點定義,結構類(class)呼叫

乙個或多個,開發最常用

多類名選擇器:1.個各類名之間用空格隔開 2.節省css**,統一修改比較方便

這個標籤可以分別具有別的類名

.box 

id選擇器

html元素以id屬性來設定id選擇器,css中id選擇器以」#」來定義。

口訣:樣式#定義, 結構id呼叫, 只能呼叫一次, 別人切勿使用 

#pink 

通配選擇器

* 這裡把 html  body  div  span  li 等等的標籤都改為了紅色 *

css字型屬性

各種字型之間必須用英文,隔開

一般情況下,如果有空格,用」」隔開

盡量使用系統自帶紫天 比如microsoft yahei 微軟雅黑

最常見的字型microsoft yahei   tahoma   afial  hiragino sans gb

h2文字大小

body 

/* 標題標籤比較特殊,需要單獨指定文字大小 */

h2字型屬性 加粗

.bold 

h2700是加粗 400是變細

normal 不加粗的

bold    加粗

文字樣式

p em 

復合屬性

div 

使用復合屬性時,千萬不能更換順序  斜體 加粗 字型大小  字型

不需要的屬性可以省略  但是不許保留font-style 和font-family屬性  否則不起作用

css文字屬性

css text屬性可以定義文字的外觀,比如文字的顏色,對齊文字,文字縮排,行間距,文字裝飾

文字顏色

div 

對齊文字

h1裝飾文字

div 

a 其中,取消下劃線是取消鏈結的下劃線

前端學習之css

1.html中的三種布局格式 a.標準流 網頁中預設的方式 b.浮動 c.定位 2.html的兩大元素 a.塊級元素 獨佔一行 div h1 h6 table p 有序無序列表 ol ul li 等等 b.內聯元素 和相鄰的內聯元素在同一行 a span image input 等等 文字1文字2 ...

記錄 前端入門之css 一

css是一種層疊樣式表檔案 標籤選擇器 div 類名選擇器 box id選擇器 boxid body,ul,ol 假如在ul下面的li中巢狀乙個ol li,像下面 直接子代選擇器 ul li 只能定位到ul下面的li,不能定位到ol下面的li.間接後代選擇器 ul li 能定位到ul下面的li跟ol...

前端學習之CSS 背景

通過 css 背景屬性,可以給頁面元素新增背景樣式。背景屬性可以設定背景顏色 背景 背景平鋪 背景位置 背景影象固定等。樣式名稱 background color定義元素的背景顏色 使用方式 其他說明 元素背景顏色預設值是 transparent 透明 使用方式 其他說明 實際開發常見於 logo ...