web前端 CSS詳解

2022-08-26 07:03:08 字數 1355 閱讀 4897

css(casading style sheet)是一組html元素外觀的設定規則,用於控制web頁面的表現形式,一般被翻譯為「級聯樣式表」或「層疊樣式表」。通常情況下,我們是用html標籤定義文件的內容,用css定義內容的表現形式,這樣將頁面內容與表現形式分離,可以使html文件**看起來更加簡練,縮短瀏覽器的載入時間。

1.基本語法規則

css的語法規則比較簡單,由三部分組成:選擇器、屬性、值,寫法如下:

selector
2.樣式的引用方式

紅色的文字

如果多種樣式之間存在衝突,其優先順序是:內聯樣式 > 頁面內樣式 > 引入的樣式。

3.選擇器分類

4.偽類

有乙個屬性是cursor,其有四個值。wait等待)、pointer(小手指)、help()、default(預設箭頭)。要注意的是a:hover 必須跟在 a:link 和 a:visited後面,a:active 必須跟在 a:hover後面。

5.常用的css屬性介紹

(一)字型屬性

(二)背景屬性

(三)區塊屬性

(四)列表屬性

(五)方框屬性

瀏覽器通過box模型(盒子)來確定元素中間距、邊框、邊距等的位置,其中邊框稱為border,邊距稱為margin,間距被稱為padding。

(六)方框屬性

(七)定位position

定位共分為四種,分別是static、relative、absolute、fixed。這四個定位各不相同,屬性值有四個,分別是left、right、top、bottom。

(八)overflow

css overflow 屬性可以控制內容溢位元素框時在對應的元素區間內新增滾動條。overflow屬性有以下值:

配合屬性:text-overflow:ellipsis,其會將超出的部分換成三個點。white-space:nowrap,其設定瀏覽器變動時,一行的文字不會隨之換行,超出的話就會顯示左右滑動的滾動條。

white-space:nowrap;overflow:hidden;text-overflow:ellipsis;這三個屬性使用會將超出的部分以點點替代。

Web前端CSS初探

通過對 css和 html 中div 的簡單設定就可以做乙個非常漂亮的頁面,只不過就是有點繁瑣,不過只要有耐心,做乙個簡單的好看的頁面還是可以的。css中最最基礎的是對和文字的設定。頁面大多都是有文字和組成的,對文字和的設定是最基本要學會的。文字設定 也許剛開始學習的時候不是特別明白為什麼對文字進行...

web前端基礎 css

前言 繼續努力 什麼是css?就是對html進行美化,好比化妝前後的差距。html的塊級標籤 標籤 預設獨佔一行,跟同級兄弟塊豎直排列 標籤 預設同在一行,跟同級兄弟塊橫向排列 塊級標籤只有結合css樣式才有意義!修飾div標籤一般用style屬性並使用樣式,不贊成用align屬性 css的語法格式...

web前端 CSS樣式

一 樣式 a css cascading style sheet 層疊樣式表 b 樣式的引入方式 行內樣式 內容 內部樣式 在頁面頭部 外部樣式 在頁面頭部以link標籤鏈入 c 樣式的基本語法 1.選擇器 2.基本選擇器的種類 1.標籤選擇器 標籤名稱 同名標籤自動響應 2.類選擇器 類選擇器名稱...