CSS3 常用屬性

border-radius 圓角

乙個值/四個值/每個值拆分成兩個方向值

box-shadow 盒子陰影/（效能殺手）

box-shadow: x y [模糊半徑] [陰影拓展半徑] [陰影顏色] [投影方式]

text-shadow 文字陰影 /（效能殺手）

text-shadow: x y [模糊半徑] [陰影顏色]

rgba(r, g, b, a)

注意與opacity的區別

opacity與rgba中的a區別:

opacity下面的元素會繼承opacity屬性；

rgba中的a僅自己使用。

<

html
lang
="zh"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>常用屬性
title
>
<
style
>
button
pstyle
>
head
>
<
body
>
<
button
>btn
button
>
<
p>不交學費
線性漸變
background:linear-gradient(direction, color [percent], color [percent])屬性值引數詳解如下：
direction //漸變方向
寫方向：to bottom/to bottom right……
寫角度：0deg/45deg
color //漸變顏色
percent // 百分比
徑向漸變
background:radial-gradient(shape r/(a,b) at position, color [percent], color [percent])屬性值引數詳解如下：
shape //形狀
circle/ellipse
r/(a,b) // 半徑/(長短軸)
position //中心點位置
畫素值/百分比/方向(top left)/也可以是乙個值，第二個值預設center
*transparent透明
<

html
lang
="zh"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>常用屬性
css3 新增 border值：
可單獨設定每邊的border
border: border-width border-style b order-color;
給border新增背景
border-image：url number style;屬性值詳解如下：
url //位址
number // 裁剪的值
style // 新增的方式
例如：花邊效果
文字屬性：文字溢位
text-overflow: clip|ellipsis|ellipsis-word 屬性值詳解如下：
clip //不顯示省略標記(…),而是簡單裁切
ellipsis //當物件文字一出時顯示省略標記(…)，省略標記插入的位置是最後乙個字元
white-space:nowrap 文字不會換行，直到遇到 
標籤為止。(css2.1)
單行打點：
text-overflow:ellipsis;
white-space:nowrap; //強制文字在一行內顯示
overflow:hidden; //溢位內容為隱藏
多行打點：
-webkit-line-clamp: 2;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;//子元素被垂直排列
overflow:hidden;
多行打點相容性不好，可用js操作
文字屬性：文字換行
word-wrap: normal|break-word; 屬性值詳解如下：
normal //連續文字換行
break-word //內容將在邊界內換行（強制換行）
文字屬性：文字字型
@font-face{
font-family: 'shadowsintolight』;
src: url('./shadowsintolight.ttf');/*相容ie*/
src: 
url('./shadowsintolight.eot?#iefix') format('embedded-opentype』),
url('./shadowsintolight.woff') format('woff』),
url('./shadowsintolight.ttf') format('truetype』),
url('./shadowsintolight.svg') format('svg');
zhaozi.cn/s/all/ttf/ind
ex_2.php
（這裡的字型庫更好看）
				
CSS3常用屬性
font family 設定字型。比如 font family microsoft yahei font weight 字型粗細，屬性值 normal bold bolder lighter 100 900 line height 行間距 text indent 首行縮排 letter spacin...
				
常用css3屬性
1.設定文字的可選擇性 webkit user select none text 2.設定背景的繪製區域 background clip border box padding box content box 3.使元素看起來像標準的butt on 4.去掉type為number型別的小箭頭 inpu...
				
css3常用屬性
1.塊級元素水平居中 margin 0 auto 2.塊級元素上下居中 vertical align middle 3.text decoration none 沒有線 underline 下劃線 overline 上劃線 line through 刪除線 4.text indent 文字首行縮排 ...