|
導讀網頁的本質就是超級文本標記語言,通過結合使用其他的Web技術(如:腳本語言、公共網關接口、組件等),可以創造出功能強大的網頁。因而,超級文本標記語言是萬維網(Web)編程的基礎,也就是說萬維網是建立... 網頁的本質就是超級文本標記語言,通過結合使用其他的Web技術(如:腳本語言、公共網關接口、組件等),可以創造出功能強大的網頁。因而,超級文本標記語言是萬維網(Web)編程的基礎,也就是說萬維網是建立在超文本基礎之上的。超級文本標記語言之所以稱為超文本標記語言,是因為文本中包含了所謂“超級鏈接”點。 用html+css可以很方便的進行網頁的排版布局,但不是每一種屬性或者代碼我們都銘記于心,最近我把CSS中的常用代碼進行了歸納總結,方便自己以后查看,同時也分享給大家,希望對你們有用。一.文本設置 1、font-size: 字號參數 2、font-style: 字體格式 3、font-weight: 字體粗細 4、顏色屬性 color: 參數 注意使用網頁安全色 二、超鏈接設置 text-decoration: 參數 主要用途是改變瀏覽器顯示文字鏈接時的下劃線。 參數取值范圍: underline:為文字加下劃線 overline:為文字加上劃線 line-through:為文字加刪除線 blink:使文字閃爍 none:不顯示上述任何效果 三、背景 1、背景顏色 background-color: 參數 2、背景圖片 background-image: url(URL) URL就是背景圖片的存放路徑,none表示無。 3、背景圖片重復 background-repeat: 參數 參數取值范圍 : no-repeat:不重復平鋪背景圖片 repeat-x:使圖片只在水平方向上平鋪 repeat-y:使圖片只在垂直方向上平鋪 如果不指定背景圖片重復屬性,瀏覽器默認的是背景圖片向水平、垂直兩個方向上平鋪。 4、背景圖片固定 背景圖片固定控制背景圖片是否隨網頁的滾動而滾動。如果不設置背景圖片固定屬性,瀏覽器默認背景圖片隨網頁的滾動而滾動。為了避免過于花哨的背景圖片在滾動時轉移瀏覽者的注意力,一般都設為固定 background-attachment: 參數 參數取值范圍: fixed:網頁滾動時,背景圖片相對于瀏覽器的窗口而言,固定不動 scroll:網頁滾動時,背景圖片相對于瀏覽器的窗口而言,一起滾動 四、區塊 1、單詞間距 word-spacing: 間隔距離 2、字母間距 letter-spacing: 字母間距 3、文本對齊 text-align: 參數 參數的取值: left:左對齊 right:右對齊 center:居中對齊 justify:相對左右對齊 4、垂直對齊 vertical-align: 參數 top:頂對齊 bottom:底對齊 text-top:相對文本頂對齊 text-bottom:相對文本底對齊 baseline:基準線對齊 middle:中心對齊 sub:以下標的形式顯示 super:以上標的形式顯示 5、文本縮進 text-indent: 縮進距離 12px相當于一個文字距離 6、空格 white-space: 參數 normal 正常 pre 保留 nowrap 不換行 7、顯示樣式 display: 參數 參數取值范圍: block:塊級元素,在對象前后都換行 inline:在對象前后都不換行 list-item:在對象前后都換行,增加了項目符號 none:無顯示 五、方框 1、height 高度 2、width 寬度 3、padding 內邊距 4、margin 外邊距 5、float(浮動):可以讓塊級元素在一行中排列,例如橫向菜單。 6、clear 清除浮動 六、邊框 1、樣式 border style 參數 邊框樣式的參數: none:無邊框 dotted:邊框為點線 dashed:邊框為長短線 solid:邊框為實線 double:邊框為雙線 2、寬度 border width 參數 3、顏色 border color 參數 七、列表 list-style-type 列表樣式 不同瀏覽器的列表符可能不相同,可能會影響到網頁,所以網頁中的列表大多都是由背景圖片顯示。 控制用戶界面的樣式 八、鼠標 cursor:鼠標形狀參數 CSS鼠標形狀參數表: 鼠標形狀:CSS代碼 style="cursor:hand" 手形 style="cursor:crosshair" 十字形 style="cursor:text" 文本形 style="cursor:wait" 沙漏形 style="cursor:move" 十字箭頭形: style="cursor:help" 問號形 style="cursor:e-resize" 右箭頭形 style="cursor:n-resize" 上箭頭形 style="cursor:nw-resize" 左上箭頭形 style="cursor:w-resize" 左箭頭形 style="cursor:s-resize" 下箭頭形 style="cursor:se-resize" 右下箭頭形 style="cursor:sw-resize" 左下箭頭形 以上就是常用CSS代碼大全(工作必備)的詳細內容,更多請關注php中文網其它相關文章! 網站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。 |
溫馨提示:喜歡本站的話,請收藏一下本站!