Time of Update: 2018-12-05
第一步:建立一個無序列表我們先建立一個無序列表,來建立菜單的結構。代碼是:<ul><li><a href="1">首頁</a></li><li><a href="2">產品介紹</a></li><li><a href="3">服務介紹</a></li><li><a href="4">支援人員</a><
Time of Update: 2018-12-05
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><html xmlns="http://www.w3.org/1999/xhtml"><head> <style> * {
Time of Update: 2018-12-05
代碼Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><html><head> <style type="text/css"> div.RoundedCorner...{background: #9BD1FA} b.rtop, b.rbottom...{display:block;background: #FFF}
Time of Update: 2018-12-05
css中對於文字溢出時的控制可以通過text-overflow:clip|ellipsis作溢出控制;其中clip只是作簡單的裁切;ellipsis在裁切的同時添加"...",這種方式比js截取字元的方式要好些(針對搜尋最佳化seo)。但是text-overflow:clip|ellipsisFirefox下是不支援的。那麼我們如何來控制Firefox下文字溢出呢?在這裡介紹兩種方法:方法一:你可以看到Firefox下被截取的文本後面也添加了"...",那麼這是如何做到的呢,代碼如下:View
Time of Update: 2018-12-05
CSS架構之一 YAML大家比較熟悉的是js架構,例如prototype、jQuery呀。其實XHTML+CSS也是有架構的,最著名的可能就是YUI了,是yahoo開發 小組的。但是那個稍微有點龐大,而且牽扯到一些的JS架構。所以剛開始研究的時候可能稍微有點累。而這個yaml就比較單純了。可能是現在還在發展初期所 以架構很簡單,東西不多,對XHMTL+CSS架構感興趣的可以去看看哦。在國內好像還沒有那個朋友在做這個東西,如果你有興趣,自己鑽研一下說不定中國
Time of Update: 2018-12-05
CSS命名規則 頭:header 內容:content/containe 尾:footer 導航:nav 側欄:sidebar 欄目:column 頁面外圍控制整體布局寬度:wrapper 左右中:left right center 登入條:loginbar
Time of Update: 2018-12-05
1.使用簡寫 如果你現在還對簡寫一點都不瞭解,那你就又寫落伍了,不過幸好,學起來並不是很難。使用簡寫是一種讓代碼減少的最簡單方法。沒有比現在更適合實踐代碼簡寫的時候了,還等什麼,一起來看看吧。Margin、border、padding、background、font、list-style和outline 都是可以進行簡寫的屬性。CSS簡寫就是不再使用不同的相類似屬性的聲明…p { margin-top: 10px; margin-right: 20px;
Time of Update: 2018-12-05
十六進位的顏色值對位元與大小寫十六進位的顏色值預設標準是大寫及6位元標註。在未知情況下不希望冒險而降低了渲染的效率。 不贊成 - color:#f3a;建議用 - color:#FF33AA; display與visibility的差異display隱藏對象不保留物理空間,visibility為隱藏對象保留佔據的物理空間。當瀏覽器渲染被佔據的物理空間時,會有所消耗資源。 不贊成 - visibility:hidden;建議用 - display:none;
Time of Update: 2018-12-05
css() 可以為這個方法傳遞一個字串的屬性名稱。例如:css('backgroundColor').對於由多個單片語成的屬性名稱,JQ中可以理解為CSS標記法(如:css('background-color')),也可以理解為駝峰大小寫形式的DOM標記法(如:css('backgroundColor'))。CSS()的三種用法: 1. css(key, value) 給匹配的元素,設定一個樣式。 key (String):
Time of Update: 2018-12-05
在總結浮動與定位之前,先引入一個概念,就是HTML中文檔流,文檔流簡單的理解就是HTML中的元素按照代碼的先後順序以從左至右,從上到下的順序排列,一個接一個的排列,也就成為了一個流stream,每個元素都在文檔流中都佔據一定的大小、空間,改變一個元素的布局會直接影響其他元素的布局。 而浮動與定位中的絕對位置都會使元素脫離文檔流,什麼意思呢?就是說如果一個元素被設定了浮動或絕對位置屬性,那麼這個元素好像脫離HTML文檔一樣,而其餘的元素重新按照正常的文檔流排列。浮動:浮動會使元素脫離正常的文
Time of Update: 2018-12-05
什麼是等高布局?先來看一個案例: 中的頁面的主體內容是兩列結構,左列是用來導航的,右列是用來顯示內容的。我們看到它們有一個共同的邊框,中間還有一條分隔線,左右兩列的高度都是不固定的。這種情況下就需要兩列的高度保持一致了,左邊高度增加,右邊也跟著增加,右邊高度增加,左邊同樣也要增加,否則就會出現“斷層”的效果。在這裡,等高布局是為了維護邊框線條的完整性,在有些地方則可能是為了維護背景的完整性,達到整體一致不缺失的效果。布局方案等高布局有幾種不同的方法,但目前為止我認為瀏覽器安全色最好最簡便的應該是
Time of Update: 2018-12-05
近來沒事,搞了一下自訂CSS,搞完後感覺還過得去。代碼如下:/*自訂CSS*/#top {height:80px;overflow:hidden;background:url(http://images.cnblogs.com/cnblogs_com/Yosland/84995/o_mylogo1.gif) #FFFFFF no-repeat;border:none;margin:0 auto;padding:0;}#top h1 a {display:none;}#top h1
Time of Update: 2018-12-05
首先介紹一下HTML文檔與CSS 的關聯常見有4種方式: 1、使用link標記 <link rel="stylesheet" type="text/css" href="sheet.css" /> 2、使用style元素 <style type="text/css"> body{background:#fff;} h1{font-size:12px;} </style> 3、使用@import指令 <style type="text/css">
Time of Update: 2018-12-05
具體比如一個 div 中有兩個 span ,如果把 span 浮動了,你會發現 div 的背景色會失效!原因是 div 預設會象傳統的 table 一樣自動擴大,但預設不對浮動後的元素產生這樣的效果.所以這時的 div 根本沒有自動增大一塊來容納 span .據說解決辦法是在 div 的最後加一個空白文本之類的元素,還有討論用 overflow:hidden; 的(ie通常不相容,我試過沒效果的,當然這讓我們理解 overflow 作用原理是很好的).說實話我覺得這些對 div
Time of Update: 2018-12-05
word-wrap是控制換行的,可取:word-wrap:break-word | normal | break-all |
Time of Update: 2018-12-05
文章目錄 Tags: 關於用DIV+CSS來製作列表的時候,大家最常用的是用ul和li來編寫,但是這樣用出現兩個比較麻煩的地方: 1、如果用UL還布局,右邊一欄比較麻煩; 2、文字外邊的邊框自適應比較麻煩; 3、很可能要定死高度; 所以,細細地看一看這個布局,想一想還是用DL.DT.DD作是合理的: 1、布局合理一些; 2、將來擴充很方便; 3、CSS一定很少;
Time of Update: 2018-12-05
瀏覽器之間的css互相不相容,相信網頁製作人員都會深惡痛絕。收集了一些常見的相容問題解決方案 與大家一起分享1. 文字大小不相容。同樣14px的宋體字,ie下實際占高16px,下留白3px,firefox下實際占高17px,上留白1px,下留白3px。文字大小不相容解決方案:給所有文字設定通用line-height值2.
Time of Update: 2018-12-05
IE,firefox置中的區別 FF設定body中text-align:center,則body中的text置中,body中的div還是預設的left對齊。 IE設定body中text-align:center,不光text置中,body中的div也會置中 而對於body中的div中的text。因為div繼承了body的text-align:center,所以
Time of Update: 2018-12-05
IE6雙倍邊距問題在IE6中查看時,卻會發現左側外邊距100像素,被擴大到200個像素,加上display: inline可解決;.floatbox { float: left; width: 150px; height: 150px; margin: 5px 0 5px 100px; display: inline; }解決IE6不支援position:fixed;屬性常規 position:fixed; 實現方法 例:右下角 <div id="top">..
Time of Update: 2018-12-05
修改原因及說明 1、Aspx頁面修改為HTML頁面: 原因:完成對HTML頁面的請求比Aspx頁面的時間更短。能在最短的時間內將頁面內容呈現給使用者。原理:HTML頁面不需要Asp.net建立頁面類的執行個體,也不會經曆Aspx頁面的生命週期。Asp.net只需要讀取請求的HTML檔案並將HTML文本發回用戶端就能完成當前請求。 2、JS檔案在HTML頁面載入完成後載入: 原因:在有複雜的頁面控制或使用者互動的頁面,通常會有較多的JS代碼。在頁面中用<script>