顯示具有 CSS 標籤的文章。 顯示所有文章
顯示具有 CSS 標籤的文章。 顯示所有文章
2022-07-15

[轉載] CSS 变量教程

›
轉載自： 阮一峰 CSS 变量教程 今年三月，微软 宣布 Edge 浏览器将支持 CSS 变量。 这个重要的 CSS 新功能，所有主要浏览器已经都支持了。本文全面介绍如何使用它，你会发现原生 CSS 从此变得异常强大。 一、变量的声明 声明变量的时候，变量名前面...
2014-03-05

CSS 選擇器權重表

›
!important style="" #id htmlTag .class 權重 10000 1000 100 10 1 ...
2014-02-21

[T4] url, base64, sprite 三種格式的 icons.css 產生器

›
之前有寫過 [PHP] url, base64, sprite 三種格式的 icons.css 產生器 ，這次換用 C# T4 Text Templates 來製作這個功能: int spriteGap = 30; var scanTypes = new string[]...
2014-02-05

[CSS] float 與 clear

›
float 一開始是用來定義文繞圖的呈現，後來其浮動特性很適合用來排版佈局，所以大部分的網頁都用這種方式排版。 特性: 不佔用父元素的空間 寬高會內縮至子元素所呈現的大小 會排擠其他相鄰的 inline 元素 在所定位的空間不足時會自動換行 <div sty...
2014-01-30

[CSS] display inline, block 與 inline-block

›
inline 行內 (例如: <b>，<span>)，具有以下特性: 會連接在文字及 inline 元素之後 不具有 width, height 以及上下的 padding, margin (padding-top, padding-bottom, ...

[CSS] Selector Meaning

›
Selector Meaning AB A and B A, B A or B A B foreach B whose parents contains A A > B foreach B whose parent is A A + B foreach B wh...
2014-01-21

[Less] 簡單做到背景漸層

›
對選顏色不擅長，又想在網頁做出 CSS 漸層效果，Less 提供了兩個方便的函數 lighten(加亮顏色)、darken(加深顏色)，透過這兩個函數就可以輕鬆產生漸層所需要的色差，然後調整百比值就可以控制漸層的色階。 .toolbar { @color: #914;...
2013-08-17

[PHP] url, base64, sprite 三種格式的 icons.css 產生器

›
先做一個假設，如果 icon 的檔名就是 css 的 class 樣式名稱，那麼我們只要掃瞄資料夾的 Icon 圖檔，然後產生對應的 CSS 檔案，這樣就可以省去製作 Sprite 圖檔跟維護 CSS 對應的問題。 第一種 url 格式只是取得路徑的問題。 第二種 bas...
2013-07-07

[轉載][CSS] drop-shadows without images

›
轉載自： CSS drop-shadows without images Lifted corners Curled corners Perspective Raised box Single vertical curve Vertical curves Single hor...
2013-06-04

[轉載][CSS] 3D 立體文字

›
轉載自： 3D Text 3D 立體文字 h1.title_3d { color: #FFFFFF; font: bold 50px/1 "Helvetica Neue",Helvetica,Arial,sans-serif; ...
2013-05-29

[轉載] Default style sheet for HTML 4

›
轉載自： W3C Appendix D. Default style sheet for HTML 4 This appendix is informative, not normative. This style sheet describes the typical ...
2012-06-04

[轉載] 自適應網頁設計

›
轉載自： 自适应网页设计（Responsive Web Design） 阮一峰 随着 3G 的普及，越来越多的人使用手机上网。 移动设备正超过桌面设备，成为访问互联网的最常见终端。于是，网页设计师不得不面对一个难题：如何才能在不同大小的设备上呈现同样的网页？ 手...
2011-05-23

CSS Selector 優先權計算表

›
資料來源： 小繁的blog
2011-05-19

Hotmail, Yahoo!Mail, Gmail 郵件CSS樣式表

›
轉載自： Guide to CSS support in email clients - Articles & Tips - Campaign Monitor CSS support in HTML emails of Hotmail, Yahoo! Mail and...
2011-01-18

CSS 常用命名表

›
版面類 欄目 column 容器 container 內容 content 頁尾 footer 頁首 header 版型佈局 layout 首頁 index 頁面主體 main 側欄 sidebar 導航類 主導航 main_nav 全域導航 global_...
2010-09-12

用 PhotoShop JSX 製作 CSS Sprite 的使用方法

›
自從上一篇 利用 PhotoShop 製作 CSS Sprite 發佈後我又改了 JSX 好幾次，現在終於修到讓我自己滿意了，順便來寫一下使用方法。 由於我的 PhotoShop 是 CS2 的，太舊的版本可能會沒有 Script 的功能，在這裡先聲明一下。 檔案連結： css...
2010-09-01

利用 PhotoShop 製作 CSS Sprite

›
原本想用 PhotoShop 的巨集來製作 CSS Sprite 的圖片，但沒想到巨集沒辦法很方便的匯入圖片到圖層上，最後找到一個可行的方法就是寫 PhotoShop 的 Script。 我只有兩個需求： 處理圖檔組合 紀錄每張圖的起始定位 雖然已經寫完了，但是還是有一些小小的 ...
2010-05-22

CSS3 圓角

›
*{ /* Gecko browsers */ -moz-border-radius: 20px; /*all*/ -moz-border-radius: 20px 0; /*TL&BR, TR&BL*/ -moz-border-radius: 20px 0 2...

CSS 偽類 與 偽元素

›
:link 未被訪問過的連結 IE6, FF3, Safari3, Chrome5, Opera :visited 已被訪問過的連結 IE6, FF3, Safari3, Chrome5, Opera :hover 滑鼠重疊時(mouse over) IE7, FF...
2009-12-22

CSS 部屬經驗-圖文列表樣式

›
樣式 HTML 結構 <ul class="Img2HList ClearIt"> <li class="List Odd"> <div class="Container"...
1 則留言: