網(wǎng)頁設計中外邊距和行內(nèi)元素

外邊距還可以應用到行內(nèi)元素,不過效果稍有不同。假設你想在重點強調(diào)的文本上設置上下外邊距:strong{margin-top:25px;margin-bottom:50px;}這在規(guī)范中是允許的,不

查看詳情

網(wǎng)頁設計中的合并外邊距

第7章曾經(jīng)討論過,網(wǎng)頁設計人員可以為元素設置負外邊距。這會導致元素框超出其父元素,或者與其他元素重疊,但并不違反框模型??紤]以下規(guī)則:div{border:1pxdottedg

查看詳情

網(wǎng)頁設計中的單邊外邊距屬性

幸運的是,確實有一種辦法可以為元素單邊上的外邊距設置值。假設你只想把h2元素的左外邊距設置為3em。不必使用margin(這需要鍵入很多auto),而是可以采用以下方法:

查看詳情

網(wǎng)頁設計中的值復制

有時,為外邊距輸入的值會有些重復:p{margin:0.25em1em0.25em1em;}不過,不必像這樣重復地鍵入這對數(shù)字。不需要用上面的規(guī)則,你可以試試以下規(guī)則:p(margin:0.25em1

查看詳情

網(wǎng)頁設計中的外邊距

外邊距大多數(shù)正常流元素間出現(xiàn)的間隔都是因為存在元素外邊距,設置外邊距會在元素外創(chuàng)建額外的“空白?!翱瞻住蓖ǔV覆荒芊牌渌氐膮^(qū)域,而且在這個區(qū)域中可以

查看詳情

網(wǎng)頁設計中的基本元素框

第7章曾討論過,所有文檔元素都生成一個矩形框,這稱為元素框(elementbox),它描述了一個元素在文檔布局中所占的空間大小,因此,網(wǎng)頁設計中每個框都影響著其他元素框

查看詳情

網(wǎng)頁設計中的run-in元素

run-in元素網(wǎng)站建設CSS2引入了一個值run-in,這也是一個有意思的塊/行內(nèi)元素混合,可以使某些塊級元素成為下一個元素的行內(nèi)部分,這種功能對于某些標題效果很有用,這

查看詳情

網(wǎng)頁設計中的行內(nèi)塊元素

行內(nèi)塊元素看上去值名inline-block是一個混合產(chǎn)物,實際上也確實如此,行內(nèi)塊元素(inline-blockelement)確實是塊級元素和行內(nèi)元素的混合,這個display值是CSS2.1中新

查看詳情

網(wǎng)頁設計中的改變角色

改變元素顯示第1章曾簡單地提到,網(wǎng)頁設計中可以為屬性display設置一個值來影響用戶代理顯示的方式。既然我們已經(jīng)深入地了解了視覺格式化,下面再使用本章的概念復

查看詳情

網(wǎng)頁設計中行內(nèi)模型歷史溯源

行內(nèi)模型歷史溯源網(wǎng)站建設CSS行內(nèi)格式化模型看上去可能有些沒必要的復雜,而且在某些方面,甚至與網(wǎng)站建設人員的意愿相違背。遺憾的是,我們現(xiàn)在要創(chuàng)建的是這樣一種

查看詳情

網(wǎng)頁設計中的替換元素

增加框?qū)傩杂辛艘陨狭私?,看上去向行?nèi)替換元素應用外邊距、邊距和內(nèi)邊距似乎很簡單。內(nèi)邊距和邊框像平常一樣應用到替換元素,內(nèi)邊距在具體內(nèi)容外插入空間,邊框圍繞

查看詳情

網(wǎng)頁設計中的內(nèi)容區(qū)

行內(nèi)替換元素一般認為行內(nèi)替換元素(如圖像)有固有的高度和寬度,例如,一個圖像的高度和寬度可能是某個像素數(shù)。因此,有固有高度的替換元素可能導致行框比正常要高。

查看詳情

網(wǎng)頁設計中的增加框?qū)傩?/a>

從前面的討論可以了解到,內(nèi)邊距、外邊距和邊框都可以應用于行內(nèi)非替換元素。行內(nèi)元素的這些方面根本不會影響行框的高度。如果對一個無內(nèi)外邊距的span元素應用某個

查看詳情

網(wǎng)頁設計中的行高

管理line-height在前幾節(jié)中我們已經(jīng)了解到,改變一個行內(nèi)元素的line-height可能導致文本行相互重疊。不過,在所有情況下,這種修改都是針對單個元素的,所以,如何以一

查看詳情

網(wǎng)頁設計中的行內(nèi)格式化

行內(nèi)格式化第6章曾討論過,所有元素都有一個line-height。這個值會顯著地影響行內(nèi)元素如何顯示,所以要特別注意。首先來看如何確定一行的高度。行的高度(或行框的高

查看詳情

網(wǎng)頁設計中的行內(nèi)元素

除了塊級元素,最常見的就是行內(nèi)元素了。通過為行內(nèi)元素設置框?qū)傩?,可以進入到一個更有意思的領域(迄今為止,本書還沒涉入過這個領域)。行內(nèi)元素有一些很好的例子,

查看詳情

網(wǎng)頁設計中的塊級元素二

負外邊距負外邊距確實對垂直格式化有影響,而且它們會影響外邊距如何合并。如果垂直外邊距都設置為負值,瀏覽器會取兩個外邊距絕對值的最大值。如果一個正外邊距與

查看詳情

網(wǎng)頁設計中的塊級元素一

百分數(shù)高度前面已經(jīng)了解了如何處理設置為長度值的高度,下面再花點時間介紹百分數(shù)高度。如果一個塊級正常流元素的height設置為一個百分數(shù),這個值則是包含塊height

查看詳情

網(wǎng)頁設計中的垂直屬性

垂直格式化類似于水平格式化,塊級元素的垂直格式化也有自己一系列有意思的行為。一個元素的默認高度由其內(nèi)容決定。高度還會受內(nèi)容寬度的影響,段落越窄,相應地就會

查看詳情

網(wǎng)頁設計中的百分數(shù)和替換元素

百分數(shù)如果width,內(nèi)邊距和外邊距設置為百分數(shù)值,會應用同樣的基本規(guī)則。值聲明為長度還是百分數(shù)并不重要。百分數(shù)可能很有用。假設你希望一個元素的內(nèi)容是其包含塊

查看詳情

網(wǎng)頁設計中的負外邊距

到目前為止,看上去一切都很直接明了,你可能會奇怪前面為什么會說情況可能很復雜。外邊距還有一個方面很特殊:外邊距可以為負,這種設置是對的,完全可以將外邊距設置

查看詳情

網(wǎng)頁設計中的auto設置

設置auto如果設置width、margin-left或margin-right中的某個值為auto,而余下兩個屬性指定為特定的值,那么設置為auto的屬性會確定所需的長度,從而使元素框的寬度等

查看詳情

網(wǎng)頁設計中的水平元素

塊級元素的表現(xiàn)有時可以預測,有時則很讓人驚訝。例如,元素沿橫軸和豎軸擺放時,其處理就可能不同,為了充分了解如何處理塊級元素,必須對一些邊界和區(qū)域很清楚。圖7

查看詳情

網(wǎng)頁設計中的基本框

在前面幾章中。我們針對CSS如何處理文檔中的文本和字體介紹了很多實用知識。這一章中,我們將介紹視覺表現(xiàn)的一些理論方面,另外,前面為了強調(diào)CSS如何實現(xiàn)而跳過了一

查看詳情

網(wǎng)頁設計中的文本陰影

CSS2包含一個屬性來為文本增加陰彩,不過這個屬性并沒有在CSS2.1中保留,因為在CSS2.1完成前沒有一個瀏覽器對此提供了充分的支持??梢钥紤]一下,如果要讓Web瀏覽器

查看詳情

網(wǎng)頁設計中的文本裝飾

下面來看如何使用text-transform屬性處理文本的大小寫。默認值none對文本不做任何改動,將使用源文檔中原有的大小寫,頭名思義,uppercase和lowercase將文本轉(zhuǎn)換為全

查看詳情

網(wǎng)頁設計中的字間隔和字母間隔

前面已經(jīng)介紹了對齊,下面來看如何處理網(wǎng)頁設計中字間隔和字母間隔。同樣地,這些屬性存在一些不太直觀的問題。字間隔word-spacing屬性接受一個正長度值或負長度值

查看詳情

網(wǎng)頁設計中的垂直對齊

前面已經(jīng)討論了水平對齊,下面來看垂直對齊。因為文本行的構造將在第7章更詳細地討論,這里只是提供一個簡單的概述。行高line-height屬性是指文本行基線之間的距離

查看詳情

網(wǎng)頁設計中文本的縮進和水平對齊

不錯,很多Web設計都需要選擇適當?shù)念伾?,讓頁面有最酷的外觀,不過在真正的Web設計中,可能更多的時間都花在這樣一些問題上:文本放在哪里,文本的外觀是怎樣的。由于

查看詳情

網(wǎng)頁設計中的字體匹配

可以看到,CSS允許匹配字體系列、加粗和變形,所有這些都是通過字體匹配完成的,這是一個相當復雜的過程。如果創(chuàng)作人員想幫助用戶代理在顯示其文檔時做出正確的字體

查看詳情
網(wǎng)站建設、網(wǎng)絡營銷咨詢專線:0871-63535511(點擊可一鍵撥號)