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 入门教程 >> Only Webkit
其他教程参考

text-fill-color

text-fill-color
检索或设置对象中的文字填充颜色。
前端控 前端控 更新时间：2019-03-23 09:53:33

text-fill-color


语法：

text-fill-color：<color>

默认值：transparent

适用于：所有元素

继承性：有

动画性：是

计算值：指定值

取值：

<color>：指定文字的填充颜色。

说明：

检索或设置对象中的文字填充颜色。
  • 若同时设置 <' text-fill-color '> 和 <' color '>，<' text-fill-color '> 定义的颜色将覆盖 <' color '> 属性；
  • 通过text-fill-color属性，可以做出一些例如渐变文字和镂空文字的效果。Demo: 渐变文字 镂空文字 See with Webkit
  • 对应的脚本特性为textFillColor。

兼容性：

浅绿 = 支持

红色 = 不支持

粉色 = 部分支持


ValuesIEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
Basic Support6.0-11.02.0-40.04.0-45.0-webkit-4.0-8.0-webkit-15.0-29.0-webkit-4.0-8.3-webkit-2.1-4.4.4-webkit-18.0-42.0-webkit-


实例

<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8" />
<style>
html,body{
  margin:50px 0;
}
.text-fill-color{
  width:950px;
  margin:0 auto;
  background:-webkit-linear-gradient(top,#eee,#aaa 50%,#333 51%,#000);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font:bold 95px/1.231 georgia,sans-serif;
  text-transform:uppercase;
}
</style>
</head>
<body>
<div class="text-fill-color">text-fill-color</div>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

效果图：

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