CSS入門寶典

2021-10-06 04:20:42 字數 1713 閱讀 7095

css(cascading style sheets) ,層疊樣式表(級聯樣式表),用於設定html頁面中的文字內容的字型、大小、對齊方式等,的寬高、邊框樣式、邊距等以及頁面的布局排版等各種外觀顯示樣式。

css以html為基礎,可以針對不同的瀏覽器設定不同的樣式。css的出現可以說拯救了我們的頁面,讓html 專注去做結構呈現, 而樣式全部交給 css來美化。

我們在寫html時,需要遵從一定的規範。css也有一定的語法規範,要想熟練地使用css對頁面進行修飾,首先需要了解css樣式規則,具體格式如下:

css語法由兩部分組成:選擇器和宣告。 宣告包括:屬性和屬性值

選擇符

規則:每個css樣式由兩部分組成,即選擇器和宣告。選擇器用於指定css樣式作用的html物件,宣告又分為屬性和屬性值;

屬性是對選擇器選定的物件設定的樣式屬性,例如字型大小、文字顏色等。必須放在花括號中,屬性與屬性值用英文冒號連線,以「鍵值對」的形式出現。

每條宣告用英文分號結束。當乙個屬性有多個屬性值的時候,屬性值與屬性值不分先後順序。在書寫樣式過程中,空格、換行等操作不影響屬性顯示。

css放到什麼位置呢? 怎麼讓它跟我們的html檔案關聯起來呢?

內聯樣式,又稱行內樣式、行間樣式、內嵌樣式。是通過標籤的style屬性來設定元素的樣式。

標籤名

style

="屬性1

:屬性值1;

屬性2:屬性值2;

屬性3:屬性值3;

">

內容 標籤名

>

style

="color

:red;

">

紅色標題

h2>

內嵌式是將css**集中寫在html文件的head頭部標籤中,並且用style標籤定義

當我們頁面比較複雜,大量的內部樣式,會導致頁面看上去不美觀,而且不利於維護。這時我們通常將所有的樣式放在乙個或多個以.css為副檔名的外部樣式表檔案中,通過link標籤將外部樣式表檔案鏈結到html文件中。

樣式表特點

使用控制範圍

優先順序行內樣式表

書寫方便,權重高

較少控制單個標籤(小)

高內部樣式表

結構和樣式部分分離

較多控制乙個頁面(中)

與書寫的順序有關,後書寫的高

外部樣式表

結構和樣式完全分離,需要引入

最多,推薦使用

控制整個**(多)

與書寫的順序有關,後書寫的高

網頁中的標籤很多,為了更好的完成我們的網頁布局,我們需要在不同地方會放不同型別的標籤。

根據標籤在網頁中的顯示模式,可以將html標籤一般分為塊級標籤和行內標籤兩種型別,即塊元素和行內元素。

和相鄰行內元素在一行上顯示

設定寬、高無效,可設定水平方向的padding和margin,但垂直方向的無效。

預設寬度就是它本身內容的寬度。

行內元素只能容納文字或其他行內元素。(a除外)

通過設定display的值,改變元素的顯示模式。

Android 入門寶典 MVP 模式

m model 層,用於對資料模型操作,io 操作也在此層 v view 層,用於互動操作以及資料的顯示,傳統的 activity 屬於此層 p presenter 主持層,擁有 m 和 v 層介面,實現 m 和 v 通訊的相關邏輯 mvp 架構的實現 一 定義各層介面要實現的方法 二 定義各層的類...

css入門 CSS動畫入門

css入門 在本教程中,我將向您介紹css動畫。一種高效能的做事方式,隨著瀏覽器支援的提高而越來越流行。在介紹了基礎知識之後,我們將構建乙個簡單的示例,該示例會將乙個正方形元素動畫化為乙個圓形 在envato市場的設計師們一直忙於創造了一系列的css動畫,為你插上你的 從陰影到彩帶 滑塊等。您還可以...

MySQL基本操作,新手入門寶典

以下的文章主要向大家描述的是mysql基本操作,mysql在實際操作中是經常被用到的,所以對mysql的基本內容的了解也是一件很重要的事項,以下的文章就是對mysql基本操作的詳細描述。登陸資料庫 d phpstudy mysql bin mysql uroot proot 檢視資料庫 mysql ...