關於CSS的個人理解

2021-09-13 23:37:34 字數 2488 閱讀 2711

層疊樣式表,主要由屬性和屬性值(value)組成。(雖然html、css對**大小寫不敏感,但是屬性和屬性值對**大小寫是敏感的)

由瀏覽器將css和html分別轉化為文件物件,組合為dom文件物件模型,標記語言中的每個元素、屬性、文字片段都是dom樹中的乙個節點,再由瀏覽器轉換顯示。

(1)內聯樣式

優先順序最高,但由於會造成**冗餘及**更新任務龐大,一般不採用。

this is my first css example

(2)內部樣式表

this is my first css example

(3)外部樣式表

單獨建立乙個.css文件

易於**更新,減少**冗餘。作為新手,這一點也是必須要做到的。

this is my first css example

格式:「property : value」

屬性(property)與屬性值(value)單詞拼寫採用美式標準。

格式:「」

「;」的丟失最易導致錯誤。

格式:「selector 」

(1)層疊(cascade)

1)簡單選擇器

元素選擇器 p

類選擇器 .class

id選擇器 #id

通用選擇器 *

並且選擇器 p.class#id

並列選擇器 p,.class,#id

2)層次選擇器

後代選擇器 parent son,使用空格分割兩個選擇器

子代選擇器 parent>son,使用》分割兩個選擇器

下乙個兄弟選擇器 selector+selector,使用+分割兩個選擇器

之後所有兄弟選擇器 selector~selector,使用~分割兩個選擇器

3)屬性選擇器(form表單多用)

selector[property]

selector[property=value]

selector[property*=value]

selector[property^=value]

selector[property$=value]

selector[property~=value]

4)偽類選擇器

子元素:first-child

:nth-child()

:first-of-type

狀態:hover

:active

(順序lvha:link visited hover active)

:focus

5)偽元素選擇器

::after 常用於清除浮動

::before

::first-letter

::first-line

6)特性值:

!important(改變了css方式,盡量繞開!)

放在一段style中(1000)

id(100)

.class或偽類或屬性選擇器(10)

元素選擇器或偽元素選擇器(1)

後者覆蓋前者(按照順序)

(2)繼承

這裡不多敘述…………

(1)正常布局流

1)div行及元素

2)span塊級元素

(2)浮動布局

float:left;

float:right;

clear:both;(清除左右浮動,該元素會換行)

*塊級元素一旦浮動之後:

1)脫離了當前文件流,對父級元素失去了支撐的作用,後面的非浮動元素會插入到浮動元素的下面。

2)浮動元素的寬高預設由其內容所決定,但是我們可以為其指定寬高。

3)當浮動元素無法承載子元素的時候,子元素會在下一行顯示。

4)浮動元素的margin無法合併。

*浮動引發的問題:

1)子元素浮動會失去對父元素的支撐

解決方案:在所有子元素的末尾新增乙個空元素,該空元素須clear:both;

2)如果為子元素的寬度指定絕對值,並且子元素具有邊框,在縮放瀏覽器的時候會錯位

解決方案:

1.box-sizing:border-box;

2..right

(3)定位布局

1)靜態定位

2)相對定位

相對於該元素原先位置進行移動

relative:

topright

bottom

left

3)絕對定位

相對於該元素最近的定位父元素位置進行移動

absolute:

topright

bottom

left

4)固定定位

fixed
(4)伸縮盒布局

display:flex;

關於CSS的個人理解

層疊樣式表,主要由屬性和屬性值 value 組成。雖然html css對 大小寫不敏感,但是屬性和屬性值對 大小寫是敏感的 由瀏覽器將css和html分別轉化為文件物件,組合為dom文件物件模型,標記語言中的每個元素 屬性 文字片段都是dom樹中的乙個節點,再由瀏覽器轉換顯示。1 內聯樣式 優先順序...

關於NSRunloop的個人理解

今天看到了nsrunloop,其實之前也有看了關於nsrunloop的內容,在這裡想簡單的就個人的理解總結一下。其實自己在開發的過程當中,還沒有更多的涉及到nsrunloop的功能。總的來說,nsrunloop就是類似於windows的訊息機制。他的存在是給執行緒增加事件處理機制。對於多執行緒開發而...

個人關於指標的理解

指標是什麼?如何理解指標?因為指標是抽象的,所以這裡我把它擬物化,這樣解釋也許跟容易懂。指標的專業解釋是 指標是記憶體單元的編號。說明 以下的黑方框都代表乙個位元組 1 對於記憶體。我們一般認為記憶體的基本單位是位元組,記憶體空間由很多位元組組成的。記憶體可以儲存資料,所以我們把每個位元組當做是乙個...