CSS應用小技巧十四例

2021-03-31 08:56:30 字數 1447 閱讀 2944

在要用時選取那段文字,再在css面板上點一下「bgstyle」就行了。

8、如何給部分文字加背景影象?

與加背景色操作類似,中是在背景在選擇載入圖象就是了,乙個定義好的加背景圖象的css例子的**是這樣的:

在要用時選取那段文字,再在css面板上點一下「imgbgstyle」就行了。

9、如何使頁面的背景在文字「滾動」時背景圖案靜止不動?

要使背景圖案不隨文字「滾動」的css是這樣的:

10、如何定義字間距?

在dw3中css的屬性定義對話方塊(style definition for .style1)的「block」上的「letter spaceing」屬性定義的就是字間距,它指的是每乙個字元之間的額外間距,經長度為單位,正負值均可,當取負值時產生字元擠在一起的效果。下面**是乙個定義好的字間距css例子:

11、如何給文字加上劃線、下劃線、刪除線和閃爍?

在dw3中css的屬性定義對話方塊(style definition for .style1)的「type」上的「decoration」屬性定義的就是這些內容,要注意的是閃爍屬性有些版本的瀏覽器不支援,少用為好。下面是乙個定義好上述效果的css例子:

其中: 「underline」是定義下劃線;「overline 」是定義上劃線;「 line-through」定義的是刪除線;「blink」

定義的是文字閃爍。

12、如何使網頁具有「首行縮排」功能?

由於dw3輸入空格不方便,利用「首行縮排」將彌補這個不足。在dw3中css的屬性定義對話方塊(style definition for .style1)的「block」上的「text-indent」屬性定義的就是「首行縮排」,所謂「首行」是指每段內容的第一行,也就是直接按回車鍵就形成了乙個新的段落。縮排最好以「em」(字元)為單位,比如:漢字編排要求每段開始縮排兩個漢字,設定好的css如下所示:

在dw3要注意:在dw3中css的屬性定義對話方塊(style definition for .style1)的「block」上的「text-indent」右面的縮排單位選擇框中「ems」指的就是「em」。

13、在用**進行排版時,能使某一方向上的內容離開**線一點嗎?

可以!在dw3中css的屬性定義對話方塊(style definition for .style1)的「box」上的「margin」定義的就是內容離開邊緣的距離,分別可定義四個方向:「top」「bottom」「left」「right」。下面就是定義在左邊離開「10px」的css例子**:

14、能給某部分內容加邊框嗎?

用css可以給某部分內容加邊框,在dw3中css的屬性定義對話方塊(style definition for .style1)的「border」定義的就是邊框線,「top」「bottom」「left」「right」四邊可分別定義線的粗細和顏色,這些定義好後不要忘記在下面的「style」中定義線型,否則將看不邊框線,因為預設的線型是「none」。下面是乙個定義了上邊框為:藍色細線;左邊框為:綠色中粗線的css例子:

CSS之小技巧

css樣式設計小技巧 水平居中設定 行內元素 如果被設定元素為文字 等行內元素時,水平居中是通過給父元素設定 text align center 來實現的。水平居中設定 定寬塊狀元素 當被設定元素為塊狀元素時用 text align center 就不起作用了,這時也分兩種情況 定寬塊狀元素和不定寬...

css之小技巧

css之小技巧 1.margin的計算規則 margin百分比都是相對於容器的寬度計算的,例如 img div 父元素 位於上60px,左60px2.絕對定位元素的百分比margin 例如 img 位於上102.4px,距離祖先元素的距離3.寬度2 1自適應矩形 box box div4.一側定寬的...

css小技巧(一)

box 如 演示 box shadow 00 010px 665,00 020px blue,00 030px red 發生特點 1.塊級元素 不包括浮動元素和絕對定位元素 2.只發生在和當前文件流垂直的方向上 預設情況下文件流是水平的,writing mode可以修改流方向 修復邊距合併問題 1....