亚州免费一级毛片,精品亚洲永久免费精品

　CSS 實用實例

作者：Linyupark　時間： 2006-07-12　文檔類型：翻譯　來自：網絡維他命

第 1 頁 CSS 實用實例 [1]
第 2 頁 CSS 實用實例 [2]
第 3 頁 CSS 實用實例 [3]
第 4 頁 CSS 實用實例 [4]
第 5 頁 CSS 實用實例 [5]
第 6 頁 CSS 實用實例 [6]
第 7 頁 CSS 實用實例 [7]
第 8 頁 CSS 實用實例 [8]
第 9 頁 CSS 實用實例 [9]

Background 背景

設置背景顏色

運行代碼框
<html> <head> <style type="text/css"> body {background-color: yellow} h1 {background-color: #00ff00} h2 {background-color: transparent} p {background-color: rgb(250,0,255)} </style> </head> <body> <h1>This is header 1</h1> <h2>This is header 2</h2> This is a paragraph </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

設置一張圖片做為背景

運行代碼框
<html> <head> <style type="text/css"> body { background-image: url('/articleimg/2006/07/3744/bgdesert.jpg') } </style> </head> <body> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

垂直重復背景圖片

運行代碼框
<html> <head> <style type="text/css"> body { background-image: url('/articleimg/2006/07/3744/bgdesert.jpg'); background-repeat: repeat } </style> </head> <body> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

水平重復背景圖片

運行代碼框
<html> <head> <style type="text/css"> body { background-image: url('/articleimg/2006/07/3744/bgdesert.jpg'); background-repeat: repeat-x } </style> </head> <body> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

怎樣放置背景圖片（位置擺放）

運行代碼框
<html> <head> <style type="text/css"> body { background-image: url('/articleimg/2006/07/3744/smiley.gif'); background-repeat: no-repeat; background-position: center; } </style> </head> <body> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

固定背景圖片（不會滾動）

運行代碼框
<html> <head> <style type="text/css"> body { background-image: url('/articleimg/2006/07/3744/smiley.gif'); background-repeat: no-repeat; background-attachment: fixed } </style> </head> <body> The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page The image will not scroll with the rest of the page </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

背景屬性一行解決（用一行文字定義背景屬性）

運行代碼框
<html> <head> <style type="text/css"> body { background: #00ff00 url('/articleimg/2006/07/3744/smiley.gif') no-repeat fixed center; } </style> </head> <body> This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text This is some text </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運行]

出處：網絡維他命
責任編輯：moby

◎進入論壇網站綜合、網頁制作版塊參加討論

相關文章

組合CLASS來完成網頁布局風格

作者文章

設計上的精挑細選會削弱網站

瀏覽器發(fā)展/CSS布局/怎樣運用?


關鍵字搜索	常規(guī)搜索	推薦文檔
熱門搜索：CSS Fireworks 設計比賽網頁制作 web標準用戶體驗 UE photoshop Dreamweaver Studio8 Flash 手繪 CG

站點最新

站點最新列表

周大�！熬�•自然”設計大賽開啟

國際體驗設計大會7月將在京舉行

中國國防科技信息中心標志征集

云計算如何讓安全問題可控

云計算是多數(shù)企業(yè)唯一擁抱互聯(lián)網的機會

阿里行云

云手機年終巨獻，送禮標配299起

阿里巴巴CTO王堅的"云和互聯(lián)網觀"

1499元買真八核云OS雙蛋大促

首屆COCO桌面手機主題設計大賽

欄目最新

欄目最新列表

淺談JavaScript編程語言的編碼規(guī)范

如何在illustrator中繪制臺歷

Ps簡單繪制一個可愛的鉛筆圖標

數(shù)據同步算法研究

用ps作簡單的作品展示頁面

CSS定位機制之一:普通流

25個最佳最閃亮的Eclipse開發(fā)項目

Illustrator中制作針線縫制文字效果

Photoshop制作印刷凹凸字體

VS2010中創(chuàng)建自定義SQL Rule

中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx