摘要: 在我們進行網頁的設計中,我們會經常的用到鼠標的各種形狀,鼠標形狀的改變主要是在css文件中實現的。我們可以在css中設置cursor的屬性值來實現不同的鼠標指針形狀,cursor的不同屬性值對應著相應的鼠標形狀,下面是我整理的一些鼠標形狀和cursor屬性值:
閱讀全文
我們平常在瀏覽網頁的時候,經常會看到一些顯示特效的文字,像這樣的特效文字大多數都是利用css
樣式來實現的。在這里,我向大家介紹幾種文字的特效。
1、文字的發光效果
主要通過css樣式的glow濾鏡屬性實現的,filter:glow(color=color_value,Strength=value)
Color:表示邊緣光暈的顏色
Strength:表示邊緣光暈的強度大小,范圍在1~255之間。

代碼:css樣式
<style type="text/css">
.tb{
font-size: 40px;
filter:glow(color=skyblue,direction=2);
font-family: 華文行楷;
}
</style>
2、文字的陰影效果
主要通過css樣式的dropshadow濾鏡屬性實現的,filter:glow(color=color_value,offx=value,offy=value,positive=value);
Color:表示陰影的顏色
Offx:x軸方向陰影的偏移量。
Offy:y軸方向陰影的偏移量。
Positove:取值為false或true,true表示不透明像素建立可見的陰影,false表示為透明像素可見陰影。若不寫表示為默認,默認為true。

代碼:css樣式
.tb1{
font-size: 40px;
filter:dropshadow(color=green,offx=3,offy=3);
font-family: 華文隸書;
}
3、文字的漸變陰影效果
主要通過css樣式的shadow濾鏡屬性實現的,filter:glow(color=color_value,direction=value);
Color:陰影的顏色。
Direction:設定漸變陰影的方向,漸變陰影是按照順時針方向進行的,0º表示垂直向上,之后每45º為一個單位,默認值為270º。

.tb2{
font-size: 40px;
filter:shadow(color=skyblue,direction=135);
font-family: 黑體;
}
4、文字的圖案填充效果
主要通過dropshadow和chroma濾鏡相結合來實現。Chroma樣式
Filter:chroma(color=color_value);
Color:透明的顏色,如color為#ffcc00,則濾鏡作用范圍內的所有為#ffcc00的顏色都將變為透明,包括圖片的像素。

<div style="background-image: url(ahcme.jpg);width: 100%">
<div style="filter:chroma(color=#cccccc)dropshadow(color=#777777,offx=-1,offy=-1,positive=2);
color:#cccccc;background-color: #ffffff;width: 100%;font: bold 50pt 黑體;" >
文字的圖案填充效果
</div>
5、文字的探照燈效果
主要通過light濾鏡相結合來實現。Chroma樣式
filter:light;
在javascript中,可以使用document對象來獲得元素的light濾鏡對象,然后通過調用light濾鏡對象中的方法來實現文字的發光效果,light濾鏡中包含的方法如下:
方法 |
說明 |
addAmbient |
加入包圍的光源 |
addCone |
加入錐形光源 |
addPoint |
加入點光源 |
changcolor |
改變光的顏色 |
changstrength |
改變光源的強度 |
clear |
清除所有的光源 |
moveLight |
移動光源 |
還有關于其他的各種問題特效,等有時間整理出來之后再奉獻給各位!
摘要: 在我們進行網頁的設計中,我們會經常的用到鼠標的各種形狀,鼠標形狀的改變主要是在css文件中實現的。我們可以在css中設置cursor的屬性值來實現不同的鼠標指針形狀,cursor的不同屬性值對應著相應的鼠標形狀,下面是我整理的一些鼠標形狀和cursor屬性值:
閱讀全文