CSS

我們要建立一個測試用HTML檔案，以下是關鍵的代碼片斷 複製代碼 代碼如下:<div> <pre><code> <a href="http://creativecommons.org/licenses/by-nc-sa/2.5/cn/" rel="license">遵守我的著作權</a> <a

在網上搜尋了一下都沒怎麼看到純用CSS製作標籤導航方面的教程或者說明，大部分都是要涉及到JS的編寫的。這對於很多CSS學習中的人來說實在有些不夠體貼，既然沒人做那我來先來試試！我在這裡做的CSS標籤導航是純CSS無JS無背景圖片的綠色導航。此文章適合初學者，高手可以路過，呵呵！ xmlns="http://www.w3.org/1999/xhtml">指令碼之家01指令碼之家02指令碼之家03指令碼之家 www.jb51.net>

自從互連網開始的那一刻起，各瀏覽器間的爭鬥就沒有停止過。當然其中最苦的就是網頁製作人員了，為了達到使用者體驗以及可用性的標準，不得不在多個瀏覽器上為統一效果而奔波。真希望哪一天FF可以一統天下，雖然現在還是IE的大天下。特別是微軟最新發行的IE7瀏覽器，其CSS的相容性確實給一些網頁製作人員又添加了一個沉重的新負擔。 為了讓各瀏覽器有同樣的顯示效果，我們不得不用到CSS HACK。當然在這篇文章中我們只談現在使用率最高的IE6和FF，以及將來可能會成為主流的IE7的CSS

由於現在百分之99.99%的CMS都是用div+css來構建網頁模板的，被逼無奈，一大把年紀了還要學習CSS，說實話沒覺得用div來布局比table好在什麼地方！但迫於行勢，先硬著頭皮看吧，能學多少是多少。根據資料與結構分離的原則，CSS最好要獨立於網頁檔案，用 複製代碼 代碼如下:<link rel="stylesheet" type="text/css" href="../xxx/web.css" />

　　1、表單文本輸入的移動選擇： 　　在文本輸入欄中，如果加入了提示，來訪者往往要用滑鼠選取後刪除，再輸入有用的資訊。其實只要加入onMouseOver="this.focus()" onFocus="this.select()" 代碼到 <textarea> 中，一切就會變得簡單多了，如： 複製代碼 代碼如下:<textarea name=textarea wrap=virtual rows=2 cols=22 onMouseOver="this.focus()"

注意事項： 1、除選擇DOCTYPE之外的語句必須使用小寫英文字母書寫。其中包括 Macromedia Dreamweaver 產生的滑鼠動作，如 OnMouseOver 也必須修改成 onmouseover。 2、XHTML文法規要求所有的標識都必須有開始和結束。例如<body>和</body>、<p>和</p>等，對於不成對的標識，要求在標識最後加一個空格，然後跟一個"/"。例如<br>寫成<br />、<img&

現在好多網站都用了div+css來布局網頁結構，優點是速度快了，可負面影響呢，來看下面的分析前端時間寫了一篇《利用CSS架構進行高效率的網站開發》，有不少朋友問我相關的問題。很早5key就在公司進行CSS架構的架構，也對不少朋友提出CSS架構的建議。效果是很明顯的。當然，CSS架構有利也有弊，最近也看了一些相關的文章。一些感想，與大家分享。 CSS架構之利： 1、開發效率的提高。

這個是沒有種cookie的，記錄給自已。 複製代碼 代碼如下:<link href="001.css" id="cssfile" rel="stylesheet" type="text/css" /> <script> function changeStyle(name){ //alert(name); var css = document.getElementById("cssfile"); css.href = name+".css"; }

是美工為一網站製作的圖文並茂的新聞標題列表，採用表格進行布局，右上和下部分分布在兩個儲存格中，程式實現起來可不太容易：要麼分兩次查詢，一次取4條，一次取5條；要麼一次取出9條，再分在兩個儲存格中顯示。能不能通過設定圖片的屬性，讓文字和圖片像Word中一樣可以四周環繞對齊？這樣程式就不用理會圖片，只負責一次讀取顯示就可以了。經測試將圖片的float屬性設定為left可解決我們的問題，效果如：·新聞標題列表 ·新聞標題列表 ·新聞標題列表 ·新聞標題列表 ·新聞標題列表新聞標題列表

用純css打造星級評等效果正在被越來越多地應用在網路RIA中，結合ajax等技術，可以渲染出很出色的視覺效果和很棒的使用者體驗，在這篇文章開始之前，大家可以先去cssheaven感受一下。 最近由於項目需要，我在網上找了很多css星級評等的例子和說明，但是發現大多數都是翻譯國外的文章，而且解釋得並不是非常清楚，所以我決定自己來做一個總結，也希望能夠給大家一些協助。 首先用中文寫一下這個效果的演算法： 1. 使用背景圖片的位置切換來獲得星級效果； 2.

簡單介紹下：CSS 圖片拼合 (CSS sprites) 可有效降低圖片檔案的 HTTP 串連請求數. 多個圖片將以一定間距合并為一個大圖片檔案. 頁面中使用這些圖片的元素將利用 background-position 這一 CSS 屬性來顯示拼合圖片中的指定位置。這一技術可有效提升網站效能, 尤其是網頁上有眾多小圖片時, 如許多功能表列表徵圖. 這裡有一篇Realazy的CSS Sprites技術詳細介紹，CSS Sprites被我生生譯成了CSS圖片拼合，希望大家不要抗議：P

.test{ width:200px; height:50px; border:1px solid red; padding:10px; overflow:hidden; /*不顯示超過對象寬度的內容*/ text-overflow:ellipsis; /*當對象內文本溢出時顯示省略標記（...）*/ white-space:nowrap; /*限制在一行內顯示所有文本*/ } 指令碼之家，努力打造精品學習網站。歡迎大家光臨

關於CSS對各個瀏覽器安全色已經是老生常談的問題了, 網路上的教程遍地都是.以下內容沒有太多新穎, 純屬個人總結, 希望能對初學者有一定的協助. 一、CSS HACK 以下兩種方法幾乎能解決現今所有HACK. 1, !important 隨著IE7對!important的支援, !important 方法現在只針對IE6的HACK.(注意寫法.記得該聲明位置需要提前.) <style> #wrapper { width: 100px!important; /* IE7+FF */

1. 檢查HTML元素是否有拼字錯誤、是否忘記結束標記。 即使是老手也經常會弄錯div的嵌套關係。可以用dreamweaver的驗證功能檢查一下有無錯誤。 2. 檢查CSS是否正確。 　　檢查一下有無拼字錯誤、是否忘記結尾的 } 等。可以利用CleanCSS來檢查 CSS的拼字錯誤。CleanCSS本是為CSS減肥的工具，但也能檢查出拼字錯誤。 3. 確定錯誤發生的位置。 　　如果錯誤影響了整體布局，則可以逐個刪除div塊，直到刪除某個div塊後顯示恢複正常，即可確定錯誤發生的位置。 4

[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]

本翻譯並未得到作者或網站授權。一切權利都歸原作者及原網站所有。 如果你得到原作者或原發表網站的授權，可以自由使用本翻譯。 1.CSS字型屬性簡寫規則 一般用CSS設定字型屬性是這樣做的： font-weight:bold; font-style:italic; font-varient:small-caps; font-size:1em; line-height:1.5em; font-family:verdana,sans-serif; 但也可以把它們全部寫到一行上去： font: bold

http://5key.net/blog/article.asp?id=309 IE下專屬CSS： 複製代碼 代碼如下:<![if !IE]> <link rel="stylesheet" type="text/css" href="NOT-IE.css" /> <![endif]> IE 6 ONLY: 複製代碼 代碼如下:<!--[if IE 6]> <link rel="stylesheet" type="text/css"

我們應該養成良好的編碼習慣，CSS整體布局聲明為我們的代碼簡化、提高運行效率提供了途徑。我們列舉比較常用的形式，並加上解釋。整體布局聲明的作用在於將目標作一個整體的概括，聲明一些完全相同或基本相同的屬性及值，以免在後面的代碼中每一個標籤中都需要單獨定義。若有不同的屬性與值，後面的重新定義即可。 一、通配式整體布局聲明。 * { margin:0; padding:0; font-size:0.8em; ... }

1.CSS ID 的命名 外　套：　　wrap 主導航：　　mainnav 子導航：　　subnav 頁　腳：　　footet 整個頁面：　content 頁　眉：　　header 頁　腳：　　footer 商　標：　　label 標　題：　　title 主導航：　　mainbav（globalnav） 頂導航：　　topnav 邊導航：　　sidebar 左導航：　　leftsidebar 右導航：　　rightsidebar 旗　志：　　logo 標　語：　　banner 菜單內容1：

雖然完成了標籤式導航，但是廣場狀的導航似乎並不能夠順應現在的設計潮流，其實導航不僅可以使用css的顏色來定義，同樣可以採用精心設計的圖片或其它元素來構建導航，在這裡我們將開始改善導航的設計，使它成為更加出色的標籤效果。 　　我們將考慮去掉單一的方塊狀背景元素，使用帶色彩的圓角標籤來完成我們的設計。不過從這個改進中能夠體會到css設計的另一個優勢，就是可以不需要修改結構代碼，只需要修改樣式，便可以完成改進，所以這裡可以直接看看css代碼的設計： <style> body {