五條非常重要的CSS技巧

2022-09-25 20:21:10 字數 1455 閱讀 3529

今天向大家介紹另外五條非常重要的css技巧,可能有重複,大家多多理解這些知識一定有收益。

一、影象替換文字

#header h1 a

看得懂這個嗎?我看到很多們都logo都只是用代替,而沒有鏈結。其他,只需要更簡單的方法,利用影象替換文字的方法,顯示logo,並擁有鏈結。各個值的功能display:block; awww.cppcns.com的預設狀態是inline的,需要讓它變成塊狀的,才可能定義高度和寬度,以適應logo的寬高。另外的乙個功能是,讓鏈結在text-indent後,在原區域可點選。

text-indent:-9999em; - 難道你想刪除logo中的文字?這樣應該是你的最後選擇。因為這不符合語議標記,所以,也對搜尋引擎不友好。而這個值就是讓你的字型縮排到看不到的地方。讓你不用刪除文字。

其他的不用講了吧…

二、display:inline-block;

在寫sofished daily的css時,在頂站定日期的空間,就用了display:inline-block;顧名思義,就是在內聯情況也的塊狀,可以設定高度寬度。在gr看到一篇share講了說到了跨瀏覽器顯示這個顯示display:inline-block的方法:

.element-class

好處是什麼?好處就是不用使用float,在一行中顯示設定寬高的元素。不過,上面提到的跨瀏覽器,貌似我在ie下依然可以顯示,難道是ie tester的問題?

三、用line-height文字垂直居中

你可能知道用text-align來讓文字水平劇中,不過,卻找不到更直接的方法來讓元素垂直居。這裡,或許你可以利用一下line- height。比如你要在導航中讓文字簡直居中於導航,可能會想到用padding和margin,不過,這時,煩人的ie可能會給你製造出麻煩,所以,用line-height吧,這是乙個更簡單的方法:

上面這張的導航高度是28px,你可以給a設定這樣的值:#n**igation a,這樣,就少去了用padding和margin的麻煩了。

四、布局居中

你會發現,很多**的布局都是劇中的。原因是方便瀏覽,對使用者比較好?對於初學css的人來說,可能並不知道怎麼做吧。很簡單,就一句,假設你的布局的那個div殼是#wrapper:

div#wrapper

這就是說,讓上面沒有marwoouhgin,而左右自動適應,選擇相等的寬度。這樣就可以更好地在各個瀏覽器中表現了。

五、css縮寫

css縮寫,為什麼?簡單來說有兩個好處。一,讓你寫**更有效率,因為短;二方便修改,誰也不想對著一堆雜亂的**發呆。貌似有很多人寫過這個,不過,這裡,就重複一下吧。我並不想直接寫出所有,這樣文章看起來似乎特別長,就給一些鏈結看看,你就明白了。

css常用屬性縮寫例項

css**縮寫例項以及css縮寫原因總結

css縮寫6個圖例總結

css縮寫優化css檔案的體積程式設計客棧html

本文標題: 五條非常重要的css技巧

本文位址: /web/css/26573.html

介紹五條非常重要的CSS技巧

內容提要 介紹五條非常重要的css技巧,今天向大家介紹另外五條非常重要的css技巧,可能有重複,大家多多理解這些知識一定有收益。今天向大家介紹另外五條非常重要的css技巧,可能有重複,大家多多理解這些知識一定有收益。一 影象替換文字 header h1 a,這樣,就少去了用padding和margi...

非常重要的git

什麼是git linux出現之後,很快成為了最火的伺服器系統,因為其是開源的,所有有非常多的人對其進行開發,以至於出現了各種不同的版本。人們把自己寫的 發給linus linu創始人 由其手動的拼接這些 手動拼接了11年之後,linus用了兩周的時間寫出了git。git是linus為linux寫的分...

運算元的定址方式(非常重要)

形成運算元的有效位址的方法叫運算元的定址方式。指令中的運算元欄位的位址碼由形式位址和定址方式特徵位等組合形成。一般的指令中所給出的位址碼並不是運算元的有效位址。形式位址也叫偏移量,是指令字結構中給定的位址量。定址過程就是把運算元的形式位址變換成有效位址的過程。形式位址 定址方式 有效位址 定址方式 ...