-
史上最全的CSS hack方
做前端多年,雖然不是經常需要hack,但是我們經常會遇到各浏覽器表現不一致的情況。基於此,某些情況我們會極不情願的使用這個不太友好的方式來達到大家要求的頁面表現。我個人是
-
CSS hacker使用小結(兼容IE6、7、8)
什麼是CSS hack 由於不同廠商的流覽器或某浏覽器的不同版本(如IE6-IE11,Firefox/Safari/Opera/Chrome等),對CSS的支持、解析不一
-
CSS選擇器的權重與優先規則分享
我們在使用CSS對網頁元素定義樣式時經常會遇到這種情況:要對一般元素應用一般樣式,然後在更特殊的元素上覆蓋它們。那麼我們怎麼樣來保證我們所新定義的元素樣式能覆蓋目標元素上
-
css3 盒模型以及box-sizing屬性全面了解
文檔中的每個元素被描繪為矩形盒子。渲染引擎的目的就是判定大小,屬性——比如它的顏色、背景、邊框方面——及這些盒子的位置。在
-
利用純CSS3實現tab選項卡切換示例代碼
先來看看效果圖CSS3偽類target利用target的特性,可以實現純css的tab效果切換示例代碼如下復制代碼代碼如下: <style type=text
-
a標簽有小手狀和無小手狀css的屬性介紹
有小手狀:XML/HTML Code復制內容到剪貼板 <a href="##" title="2"
-
解決img在div中居中的問題
Img是內聯元素,要設置其margin屬性使其居中,就要將其轉換為塊元素display:block;然後利用margin:0 auto;實現圖片的水平居中;(有的設計師為
-
利用CSS3實現單選框動畫特效示例代碼
先看我們的第一個特效圖注意,這個地方的黃點不是我們特效的一部分,這個黃點之所以存在是我使用的屏幕錄制軟件自帶的。可以很清楚的看到這個特效就是當我們點擊的時候,黑點會以一種
-
CSS3實現復選框動畫特效示例代碼
先看我們的第一個特效圖實例代碼復制代碼代碼如下:<!DOCTYPE html><html lang=en><head> <
-
CSS3 animation實現簡易幻燈片輪播特效
CSS3有個別特性,可以觸發硬件GPU來加速渲染,而不是調用默認浏覽器引擎渲染;但是很多屬性,默認都是不開啟硬件加速的;需要觸發條件,一個最簡單的觸發條件就是使用3D屬性
-
利用CSS3實現折角效果實例源碼
先來看看靜態的效果圖實例代碼復制代碼代碼如下:<!DOCTYPE html><html> <head> <meta chars
-
CSS3打造磨砂玻璃背景效果
簡介這個效果是在看CSS Secrets這書上看到的,感覺很不錯; 實現原理也挺簡單的;效果圖及實現效果圖代碼實現CSS Code復制內容到剪貼板 <!DOC
-
CSS3模擬IOS滑動開關效果
前言H5站點需要IOS滑動按鈕的效果,想了想似乎CSS3能搞起,就折騰出來了...挺簡單的..請看注釋效果代碼XML/HTML Code復制內容到剪貼板 <!
-
利用CSS定位背景圖片的常用方法總結
前言大家在網上最常見的一種方案就是在父元素中relative,然後子元素absolute。這種方案當然好,不過帶來的一個缺點就是會改變元素的層級關系,如果在多個地方使用,
-
利用純css實現圖片翻轉的效果
實現效果圖如下直接上代碼吧1, body部分復制代碼代碼如下: <body> <div class=container> <
-
CSS控制div寬度最大寬度/高度和最小寬度/高度的方法
在網頁制作中經常要控制div寬度最大寬度/高度或者最小寬度/高度,但是在IE6中很多朋友都會遇到不兼容的頭疼問題,包括我也經常遇到這樣的問題,在百度查了很多都沒法解決,後
-
css控制文字自動換行的實現方法
自動換行問題,正常字符的換行是比較合理的,而連續的數字和英文字符常常將容器撐大,挺讓人頭疼,下面介紹的是CSS如何實現換行的方法對於div,p等塊級元素正常文字的換行(亞
-
利用CSS3實現平移動畫效果示例代碼
一、平移動畫有關的CSS3屬性以及相關的屬性描述 1、transition-property:是用來指定當元素其中一個屬性改變時執行transition效果(例如:長度
-
利用css繪制三角形的方法及拓展
以下是常用的三角形形狀其實都是html+css就能實現,很簡單代碼如下:第一種方法html代碼:復制代碼代碼如下:<!-- 向上 --><div cla
-
CSS代碼使純英文數字自動換行的簡單實現
當一個定義了寬度的塊狀元素中填充的全部為純英文或者純數字的時候,在IE和FF中都會撐大容器,不會自動換行並且當數字或者英文中帶有漢字時,會從漢字處換行,而純漢字卻可以自動