html手册 css手册
购物车
登陆 / 注册
微信扫码登陆
免费注册
CSS 教程手册（新）
CSS 教程手册（新）
+
CSS 入门教程
CSS速查总表
CSS 教程学习导读
CSS简介
CSS语法
CSS 创建
+
CSS 定位(Position)
+
CSS 布局(Layout)
+
CSS 尺寸 (Dimension)
+
CSS 外边距(Margin)
+
CSS 填充（Padding）
+
CSS 背景(Backgrounds)
+
CSS 边框(Border)
+
CSS 颜色(Color)
+
CSS 字体(Fonts)
+
CSS 文本(Text)
+
CSS 文本装饰(Text Decoration)
+
CSS 书写模式(Writing Modes)
+
CSS 列表样式(List)
+
CSS 表格(Table)
+
CSS 内容(Content)
+
CSS用户界面(User Interface)
+
CSS打印(Print)
+
CSS媒体查询(Media Queries)
CSS 链接(Link)
+
CSS 轮廓（Outline）
CSS 分组 和 嵌套(Grouping and Nesting)
CSS 浮动 (Float)
CSS 盒子模型（Box Model）
CSS 显示(Display)
CSS 导航栏(Navigation Bar)
CSS 溢出(Overflow)
CSS 下拉菜单(Drop down menu)
CSS 对齐(Align)
CSS 提示工具(Prompt Tool)
CSS 图片廊(Image Gallery)
+
CSS 图像透明/不透明(Opacity)
CSS 图像拼合技术(Image stitching technique)
CSS 媒体类型(Media Type)
+
Only IE
+
Only Webkit
+
Only Firefox
CSS 总结
+
CSS 原生手册
CSS 手册导读
CSS 选择器
CSS 听觉参考手册
CSS Web安全字体组合
CSS 动画
CSS 函数
CSS 单位
CSS 颜色
+
CSS 颜色值
CSS 颜色名
CSS 颜色十六进制
+
CSS 函数 Function
CSS attr() 函数
CSS calc() 函数
CSS linear-gradient() 函数
CSS radial-gradient() 函数
CSS repeating-linear-gradient() 函数
+
CSS选择器 Selectors
+
元素选择符
+
关系选择符
+
属性选择符
+
伪类选择符
+
伪对象选择符
-
CSS取值与单位 Values and Units
+
CSS 长度(Length)
+
CSS 角度(Angle)
+
CSS 时间(Time)
+
CSS 频率(Frequency)
+
CSS 布局(Layout-specific)
+
CSS 分辨率(Resolution)
+
CSS 文本(Textual)
+
CSS 函数(Functional)
+
CSS 生成内容(Content)
-
CSS 图像(Image)
+
CSS 数字(Numeric)
+
CSS语法与规则 Rules
!important
comment
@import
@page
@supports
+
CSS 属性 Property
border-top
scan
border-top-color
overflow-wrap
border-top-left-radius
text-size-adjust
border-top-right-radius
text-decoration-skip
text-underline-position
border-top-style
column-break-before
border-top-width
column-break-after
border-width
column-break-inside
bottom
text-fill-color
box-align
box-reflect
box-direction
tap-highlight-color
user-drag
box-flex
border-colors
box-flex-group
border-top-colors
box-lines
border-right-colors
box-ordinal-group
border-bottom-colors
border-left-colors
box-orient
scrollbar-3dlight-color
box-pack
scrollbar-darkshadow-color
box-shadow
scrollbar-highlight-color
box-sizing
scrollbar-shadow-color
caption-side
scrollbar-arrow-color
clear
scrollbar-arrow-color
clip
scrollbar-face-color
color
scrollbar-track-color
column-count
scrollbar-base-color
column-fill
behavior
column-gap
column-rule
column-rule-color
column-rule-style
column-rule-width
column-span
column-width
columns
content
counter-increment
counter-reset
cursor
direction
display
empty-cells
filter
flex
flex-basis
flex-direction
flex-flow
flex-grow
flex-shrink
flex-wrap
float
font
@font-face
font-family
font-size
font-size-adjust
font-stretch
font-style
font-variant
font-weight
grid-columns
grid-rows
hanging-punctuation
height
icon
justify-content
@keyframes
left
letter-spacing
line-height
list-style
list-style-image
list-style-position
list-style-type
margin
margin-bottom
margin-left
margin-right
margin-top
max-height
max-width
@media
min-height
min-width
nav-down
nav-index
nav-left
nav-right
nav-up
opacity
order
outline
outline-color
outline-offset
outline-style
outline-width
overflow
overflow-x
overflow-y
padding
padding-bottom
padding-left
padding-right
padding-top
page-break-after
page-break-before
page-break-inside
perspective
perspective-origin
position
punctuation-trim
quotes
resize
right
rotation
tab-size
table-layout
target
target-name
target-new
target-position
text-align
text-align-last
text-decoration
text-decoration-color
text-decoration-line
text-decoration-style
text-indent
text-justify
text-outline
text-overflow
text-shadow
text-transform
text-wrap
top
transform
transform-origin
transform-style
transition
transition-delay
transition-duration
transition-property
transition-timing-function
unicode-bidi
pointer-events
vertical-align
user-select
visibility
ime-mode
white-space
zoom
width
-webkit-appearance
word-break
@charset
word-spacing
text-stroke
word-wrap
text-stroke-width
z-index
text-stroke-color
writing-mode
<angle>
deg
​grad
rad
turn
s
align-content
ms
<frequency>
align-items
Hz
align-self
kHz
all
<fraction>
animation
<grid>
animation-delay
fr
animation-direction
gr
animation-duration
<resolution>
animation-fill-mode
dpi
animation-iteration-count
dpcm
dppx
animation-name
unset
animation-play-state
<string>
<url>
animation-timing-function
<identifier>
appearance
calc()
backface-visibility
toggle()
background
counter()
background-attachment
counters()
attr()
<image>
background-blend-mode
image()
background-clip
image-set()
background-color
<gradient>
background-image
repeating-radial-gradient()
background-origin
<integer>
background-position
<percentage>
background-repeat
background-size
border
border-bottom
border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
border-bottom-style
border-bottom-width
border-collapse
border-color
border-image
border-image-outset
border-image-repeat
page
border-image-slice
page-break-before
border-image-source
page-break-after
page-break-inside
border-image-width
border-left
border-left-color
border-left-style
border-left-width
border-radius
border-right
device-width
border-right-color
device-height
border-right-style
orientation
border-right-width
aspect-ratio
border-spacing
device-aspect-ratio
border-style
color-index
monochrome
initial
inherit
RGBA
Color Name
HEX
RGB
HSL
HSLA
transparent
currentColor
<length>
em
ex
ch
rem
vw
vh
vmax
vmin
cm
mm
q
in
pt
pc
px
<number>
+
CSS附录 Appendix
颜色关键字(Color Keywords)
媒体类型(Media Types)
+
CSS HACK
条件Hack
属性级Hack
选择符级Hack
+
问题和经验
Bugs及解决方案列表
CSS技巧和经验列表
其它技巧和经验列表
参考资源列表

推荐手册

CSS 教程手册（新） >> CSS取值与单位 Values and Units >> CSS 图像(Image)
其他教程参考

<gradient>

<gradient>
<gradient> 允许使用简单的语法实现颜色渐变，以便UA在渲染页面自动生成图像
前端控 前端控 更新时间：2019-03-23 17:31:00

<gradient>

语法：

<gradient> = linear-gradient() | repeating-linear-gradient() |  radial-gradient() | repeating-radial-gradient()

说明：

<gradient> 允许使用简单的语法实现颜色渐变，以便UA在渲染页面自动生成图像。渐变在一个拥有尺寸的盒子中被生成，被称之为渐变盒，但是渐变本身并没有内在的尺寸，也就说如果在一个没有尺寸的容器上定义渐变，将无法被呈现。

<gradient> 可以应用在所有接受图像的属性上

示例：

background-image: linear-gradient(white, gray);
list-style-image: radial-gradient(circle, #006, #00a 90%, #0000af 100%, white 100%);

兼容性：

浅绿 = 支持

红色 = 不支持

粉色 = 部分支持

IEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
6.0-9.02.0-3.5

4.0

-9.0-webkit-

3.1-3.215.0+3.2-4.3-webkit-2.1-3.0-webkit-10.0-25.0-webkit-
10.0+

3.6

-15.0-moz-

10.0

-25.0-webkit-

4.0-5.0-webkit-5.0-6.14.0-4.3-webkit-26.0+
16.0+26.0+5.1-6.0-webkit-7.0+4.4+
6.1+


网站导航
标签地图
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ官方交流群
微信公众号
微信公众号
Copyright © 2018-2019 html中文网 All Rights html中文网，专注于大前端知识，一站式WEB前端开发自学平台！
工信部备案号： 皖ICP备18014864号-5    
提交