CSS樣式問題集錦 一

2021-04-15 22:04:53 字數 1397 閱讀 2854

這裡記錄一些我在網頁製作過程中曾經遇到的問題,把它帳在這裡,希望對大家有所幫助。

iframe不同時出現滾動條

iframe的屬性中設定:scrolling:no,在iframe引用的頁面中加上以下樣式:

html,body  

滾動條樣式

scrollbar-face-color: #2a024d;

scrollbar-highlight-color: #0042ff;

scrollbar-shadow-color: #000000;

scrollbar-3dlight-color:#fdfdfd;

scrollbar-track-color: #000000;

scrollbar-arrow-color: #0042ff;

scrollbar-darkshadow-color: #000000;(顏色當然還是換自己喜歡的了...^^) 

一、滾動條的軌跡,記作:scrollbar-track。所謂「軌跡」,指滾動條的滑動塊執行時所必經的路線。

二、滾動條的滑動塊,即在它上面按下滑鼠左鍵不放可上下或左右移動的滑動塊以及滾動條兩頭的小方塊,記作:scrollbar-face。face即滾動條的「臉」,注意它有三張「臉」:滑動條和兩頭的小方塊。

三、滾動條亮邊框部分,記作:scrollbar-highlight。這個亮邊框,和**的亮邊框概念是一樣的,即左邊和上邊部分,滾動條的亮邊框部分是指滾動條的「臉」(即滑動塊和兩頭小方塊)的亮邊框。

四、滾動條亮邊框部分的外圍還有乙個立體修飾部分,記作scrollbar-3dlight。3d即立體的意思,它將包圍在滾動條亮邊框部分的外邊。

五、滾動條陰影部分,指主滑塊和兩頭方塊的陰影,位於左邊和左下,記作:scrollbar-shadow。

六、滾動條陰影部分還有乙個強陰影部分,記作scrollbar-darkshadow,它包圍在陰影部分的外邊。

七、滾動條兩頭方志標誌箭頭,記作:scrollbar-arrow,箭頭方向為向下、向上、向左、向右。

在xhtml中,使用body無法控制滾動條樣式問題

使用body,html{}

input元素與文字的垂直居中問題

呢稱就是給input加上vertical-align:middle屬性。

將支援valign 特性的物件的內容與物件中部對齊

img元素與文字的垂直居中問題

img元素有個屬性valign是控制其後面的元素與之的對齊方式,使用middle即可

div內部文字垂直居中

也就是說設定height與line-height一致即可。這種方法對單行文字有效。

實用CSS樣式定義集錦

將超出寬度的溢位文字顯示省略號效果 t text overflow ellipsis white space nowrap overflow hidden 用css實現table單元格資料自動換行或不換行的實現方法 word break break all 強制換行 word break keep ...

CSS問題集錦

1.如何選擇指定div下的所有的h1 h2.標題?如div的id為 cnblogs post body 我原來定義的css是 1 cnblogs post body h1 h2 h3 h4 2 結果沒有達到預期的效果。後來將css定義為 1 cnblogs post body h1,cnblogs ...

CSS布局問題集錦

這裡介紹下自己在實踐過程中遇到的一些css布局的問題,一方面做個備忘,也希望給大家帶來一點幫助。charset utf 8 兩列布局title html,body container style head class container class left 我是leftdiv class righ...