Time of Update: 2018-12-07
今天發下我自己的css架構——base.css,作用是重設瀏覽器預設樣式和提供通用原子類。@charset "utf-8";/* @名稱: base @功能: 重設瀏覽器預設樣式*//* 防止使用者自訂背景顏色對網頁的影響,添加讓使用者可以自訂字型 */html { color:black; background:white;}/* 內外邊距通常讓各個瀏覽器樣式的表現位置不同 */body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
Time of Update: 2018-12-07
ie6 中 li 插入圖片後下方有空隙 bug,這是 ie6 的有一個經典 bug。解決該 bug 有很多方法,今天我整理了下,共4種方法,給大家分享下。首先附上代碼:<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css"
Time of Update: 2018-12-07
前幾天有去 網易 參加他們在廣州的一個社會招聘,職位是 前端工程師(重構方向) ,周末閑來無聊就去試試,面試官問到我一個問題,是關於CSS的最佳化. 首先,面試官問我CSS選取器的最佳化,我對於CSS選取器效能的粗略理解是: ID選取器>類別選取器>標籤選取器>相鄰選取器>子選取器>後代選取器>萬用字元選取器>屬性選取器>偽類別選取器
Time of Update: 2018-12-07
相關樣式:CodeCode highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->.mainbox h3{ margin-bottom:0px; line-height:32px;height:32px;padding-left:1em;background:url(http://www.cnblogs.com/Images/forumbg.gif) repeat-
Time of Update: 2018-12-07
上次給別人示範div的效果時,寫了css樣式卻一直不能呈現,最後不小心發現自己在寫css樣式時候,給一個class命名為數字開頭的名稱,才想起來自己去年剛學習樣式表時候也出現此問題,最後被我解決掉的,聲明一下css中的名稱不要以數字開頭,最好是字母開頭。以下是:CSS
Time of Update: 2018-12-07
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords"
Time of Update: 2018-12-07
css position: absolute、relative詳解position: absolute 將對象從文檔流中拖出,使用left,right,top,bottom 等屬性相對於其最接近的一個最有定位設定的父物件進行絕對位置。如果不存在這樣的父物件,則依據body對象。而其層疊通過z-index屬性定義,z-index值為無單位的整數,大的在最上面,可以有負值此時對象不具有外補丁( margin ),但仍有內補丁( padding )和邊框( border
Time of Update: 2018-12-07
以前寫過一篇純CSS製作帶三角的邊框,那篇文章是用HTML特殊字元來製作三角的,今天介紹下,如何用 border 來製作三角。html 代碼如下:<div class="arrow-up"></div><div class="arrow-down"></div><div class="arrow-left"></div><div class="arrow-right"></div>css 代碼如下:.
Time of Update: 2018-12-07
我們在做頁面時不可避免的會碰到瀏覽器安全色問題,特別是IE6,那麼要如何相容所有瀏覽器呢,答案是CSS HACK。下面的代碼是我自己整理的一些常用css hack,希望能夠協助到大家。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html
Time of Update: 2018-12-07
寫的代碼多了,就會發現,自己越來越無知了,總以為html css很簡單,已經掌握的很熟練了,其實我還差的很多。 平時沒有用過css的這種寫法 .a.b{display:block;} 上網一查才明白。 參考:http://www.w3school.com.cn/css/css_selector_class.asp1、在 HTML 中,一個 class
Time of Update: 2018-12-07
百忙之中抽時間編寫了這個小程式,功能是:完美儲存整個網頁,包括:圖片、JS指令碼、CSS樣式,並且修改網頁源碼進行“本地化”。由於我火星了,竟然不知道瀏覽器內建這個功能,因此自己動手做了一個,雖然這個程式不大,但是涉及了三大難題(後文將會詳細講解)。
Time of Update: 2018-12-07
很早以前就接觸過CSS,但對於浮動始終非常迷惑,可能是自身理解能力差,也可能是沒能遇到一篇通俗的教程。 前些天小菜終於搞懂了浮動的基本原理,迫不及待的分享給大家。 寫在前面的話: 由於CSS內容比較多,小菜沒有精力從頭到尾講一遍,只能有針對性的講解。 如果讀者理解CSS盒子模型,但對於浮動不理解,那麼這篇文章可以協助你。 小菜水平有限,本文僅僅是入門教程,不當之處請諒解! 本文以div元素布局為例。 教程開始:
Time of Update: 2018-12-07
相信很多喜歡研究網頁介面的童鞋都遇到過一個奇妙的現象:網頁中很多圖片素材被合成在一張圖片上。 起初小菜模仿網站的時候,經常遇到這個現象,那時候也不知道這時什麼技術,人家的整張圖片素材不會利用,只能用ps切圖,切成單個的再用。。。 其實,這是一個非常簡單的技術,就是因為想象的太難了,才一直找不到問題的關鍵。 要想實現CSS摳圖,只需要用到一個屬性:background-position。
Time of Update: 2018-12-07
Time of Update: 2018-12-07
Css 中實現邊界凹陷狀態的方法是:設定控制項的左右border(基本上是一黑一白)例如(顏色請進行調整):border-left:1px solid #e4e4e4;border-right:1px solid red; 正常情況下border 的長度 是外加到對應的控制項之上的,如果想讓border的寬度包含在控制項之內,即:讓border 的效果顯示在控制項邊框之內,可用如下方法:即:在Css中加入如下語句box-sizing:border-box; 這個是對於IE瀏覽器來說的-moz-
Time of Update: 2018-12-07
題目:在頁面上有三個塊,左右塊的寬度高度固定,中間塊寬度撐滿在左右塊之間,然後中間塊的寬度可以跟著瀏覽器的變化而變化答案一:<div class="left">左</div><div class="right">右</div><div class="content">中</div>.left {float:left;width:300px;height:500px;background:#F00;}.right
Time of Update: 2018-12-07
文章目錄 Containers(容器)Grids (網格)/ Columns(列)MarginsStyling(添加樣式) CSS架構 :960 Grid System 官網:http://960.gs/ 什麼是架構?架構是一種你能夠使用在你的web項目中概念上的結構。CSS架構一般是CSS檔案的集合,包括基本風格的字型排版,表單樣式,表格版面配置等等,比如: * typography.css 字型排版規則 *
Time of Update: 2018-12-07
[CSS]文字框輸入長英文串撐大容器問題http://tech.ddvip.com/2007-09/119070262735449.html word-wrap是控制換行的。break-word是將強制換行。中文沒有任何問題,英文語句也沒問題。但是對於長串的英文,就不起作用。break-word是控制是否斷詞的。normal是預設情況,英文單詞不被拆開。break-all,是斷開單詞。在單詞到邊界時,下個字母自動到下一行。主要解決了長串英文的問題。keep-all,是指Chinese,
Time of Update: 2018-12-07
轉自http://www.zendstudio.net/post/52/ 一直都不斷有人在問:“我要用DIV+CSS實現三列布局,並且要左右固定寬度,中間自適應,要怎麼弄?” 我一般都是這樣回答:“中間設margin-left留出leftdiv的寬度,設margin-right留出rightdiv的寬度,然後leftdiv左浮動,rightdiv右浮動!”,不過居然有人說不行。我只好用實踐證明我的真理的正確性。 OK!下面是我的完整的測試代碼。<!DOCTYPE
Time of Update: 2018-12-07
並不是所有的Web 開發人員都會對美化表格式資料感興趣,今天我們收集了20 個功能強大,外觀漂亮的基於Ajax + CSS 的表格效果,你可以從這些樣本中學習怎麼使用這些表格提供的排序和過濾的功能來組織表格中的資料。 現在讓我們來看看這些表格:(點擊每個樣式前面的連結即可進入下載) #1. Tablecloth Tablecloth 由CSS Globe 開發,是一個輕量級的、便於使用的表格,以友好的方式將樣式和行為添加到你當前的HTML 表格元素當中。 #2.