样式表 – 君土

样式表中文名称对应表

颜色

中文名	英文名
浅绿	aqua
黑	black
蓝	blue
樱红	fuch
灰	gray
绿	green
青柠	lime
褐红	maro
海军蓝	nav
橄榄	oliv
橙	orange
紫	purple
红	red
银	silver
蓝绿	teal
白	white
黄	yellow
麦	wheat
透	transparent
三透	rgba
相透	hsla
三	rgb
相	hsl

var COLOR_T = {
 '浅绿': 'aqua',
 '黑': 'black',
 '蓝': 'blue',
 '樱红': 'fuchsia',
 '灰': 'gray',
 '绿': 'green',
 '青柠': 'lime',
 '褐红': 'maroon',
 '海军蓝': 'navy',
 '橄榄': 'olive',
 '橙': 'orange',
 '紫': 'purple',
 '红': 'red',
 '银': 'silver',
 '蓝绿': 'teal',
 '白': 'white',
 '黄': 'yellow'
};

var REPEAT_T = {
 '重复': 'repeat',
 '不重复': 'no-repeat',
 '横重复': 'repeat-x',
 '竖重复': 'repeat-y',
}
var ATTACHMENT_T = {
 '滚动': 'scroll',
 '固定': 'fixed',
 '本地': 'local',
}

var POSITION_T = {
 '左': 'left',
 '中': 'center',
 '右': 'right',
 '上': 'top',
 '下': 'bottom',
}

var PAGE_BREAK_T = {
 '总是': 'always',
 '避免': 'avoid',
}

var BLEND_MODE_T = {
 '正片叠底': 'multiply',
 '滤色': 'screen',
 '叠加': 'overlay',
 '变暗': 'darken',
 '变亮': 'lighten',
 '颜色减淡': 'color-dodge',
 '颜色加深': 'color-burn',
 '强光': 'hard-light',
 '柔光': 'soft-light',
 '差值': 'difference',
 '排除': 'exclusion',
 '色相': 'hue',
 '饱和度': 'saturation',
 '颜色': 'color',
 '亮度': 'luminosity',
}

var INHERIT_T = {
 '继承': 'inherit',
}

var INVERT_T = {
 '反转': 'invert',
}

var INITIAL_T = {
 '初始': 'initial',
}

var NONE_T = {
 '无': 'none',
}
var ALL_T = {
 '全部': 'all',
}
var NORMAL_T = {
 '默认': 'normal',
}
var UNSET_T = {
 '复位': 'unset',
}
var APPEARANCE_T = {
 "图标": "icon",
 "窗口": "window",
 "按钮": "button",
 "菜单": "menu",
 "字段": "field",
}

var BREAK_WORD_T = {
 "断词": "break-word",
}

var TRANSFORM_STYLE_T = {
 '扁平': 'flat',
 '保留三维': 'preserve-3d',
}

var BOX_SIZING_T = {
 "边框方框": "border-box",
 "内容方框": "content-box",
 "内衬方框": "padding-box",
}

var BACKGROUND_SIZE_T = {
 "覆盖": "cover",
 "包含": "contain",
 "填充": "fill",
 "缩小": "scale-down",
}

var FLEX_DIRECTION_T = {
 "行": "row",
 "行反": "row-reverse",
 "列": "column",
 "列反": "column-reverse",
}

var DENSE_T = {
 "密度":"dense"
}

var RESIZE_T = {
 "双方": "both",
 "横": "horizontal",
 "竖": "vertical",
}

var UNIT_T = {
 '像素': 'px',
 '厘': 'cm',
 '毫': 'mm',
 '点': 'pt',
 '英寸': 'in',
 '相对': 'em',
 '根': 'rem',
 '秒': 's',
 '毫秒': 'ms',
 '度': 'deg',
 '%': '%',
 '弧度': 'rad',
}

var DIRECTION_T = {
 '左右': 'ltr',
 '右左': 'rtl',
}

var TEXT_ALIGN_T = {
 '左': 'left',
 '右': 'right',
 '中': 'center',
 '两端': 'justify',
 '开始': 'start',
 '结束': 'end',
}

var TEXT_DECORATION_T = {
 '下线': 'underline',
 '上线': 'overline',
 '中线': 'line-through',
 '闪': 'blink',
}
var BLUR_T = {
 '模糊': 'blur',
}
var TEXT_TRANSFORM_T = {
 '首大写': 'capitalize',
 '大写': 'uppercase',
 '小写': 'lowercase',
}
var TEXT_OVERFLOW_T = {
 "剪切":"clip",
 "省略号":"ellipsis",
}
var UNICODE_BIDI_T = {
 '嵌入': 'embed',
 '双向-覆盖': 'bidi-override',
}

var VERTICAL_ALIGN_T = {
 '基线': 'baseline',
 '下标': 'sub',
 '上标': 'super',
 '上': 'top',
 '文上': 'text-top',
 '中间': 'middle',
 '下': 'bottom',
 '文下': 'text-bottom',
}

var WHITE_SPACE_T = {
 '保留': 'pre',
 '不换行': 'nowrap',
 '换行': 'wrap',
 '反向换行': 'wrap-reverse',
 '保留-换行': 'pre-wrap',
 '保留-行内': 'pre-line',
}

var FONT_NAME_T = {
 '宋': 'SimSun, STSong',
 '黑': 'SimHei, STHeiti',
 '楷': 'KaiTi, STKaiti',
 '仿宋': 'FangSong, STFangsong',
 '衬线': 'Serif',
 '乔治亚': 'Georgia',
}

var FONT_SIZE_T = {
 '更小': 'smaller',
 '更大': 'larger',
 '小': 'small',
 '中等': 'medium',
 '大': 'large',
 'x小': 'x-small',
 'xx小': 'xx-small',
 'x大': 'x-large',
 'xx大': 'xx-large',
}
var FONT_STYLE_T = {
 '斜': 'italic',
 '倾斜': 'oblique',
}
var FONT_VARIANT_T = {
 '小型-大写': 'small-caps',
}

var FONT_WEIGHT_T = {
 '粗': 'bold',
 '更粗': 'bolder',
 '更细': 'lighter',
}

var FONT_T = {
 '标题': 'caption',
 '图标': 'icon',
 '菜单': 'menu',
 '对话框': 'message-box',
 '小标题': 'small-caption',
 '状态栏': 'status-bar',
}
var PSEUDO_T = {
 '链接': 'link',
 '已访问': 'visited',
 '悬': 'hover',
 '激活': 'active',
 '焦点': 'focus',
 '后': 'after',
 '前': 'before',
 '第一子': 'first-child',
 '第一字母': 'first-letter',
 '第一行': 'first-line',
 '第一类型': 'first-of-type',
 '最后类型': 'last-of-type',
 '仅此类型': 'only-of-type',
 '唯一子': 'only-child',
 '最后子': 'last-child',
 '根': 'root',
 '空': 'empty',
 '靶': 'target',
 '启用': 'enabled',
 '禁用': 'disabled',
 '选中': 'checked',
 '选择': 'selection',
 '出界': 'out-of-range',
 '界内': 'in-range',
 '读写': 'read-write',
 '只读': 'read-only',
 '可选': 'optional',
 '必须': 'required',
 '有效': 'valid',
 '无效': 'invalid',
 '非': 'not',
 '第几子': 'nth-child',
 '倒数第几子': 'nth-last-child',
 '类型第几': 'nth-of-type',
 '类型倒数第几': 'nth-last-of-type',
}

var LIST_STYLE_POSITION_T = {
 '里': 'inside',
 '外': 'outside',
}

var LIST_STYLE_TYPE_T = {
 '实心圆': 'disc',
 '空心圆': 'circle',
 '实心方块': 'square',
 '数字': 'decimal',
 '数字0打头': 'decimal-leading-zero',
 '小罗马': 'lower-roman',
 '大罗马': 'upper-roman',
 '小英文': 'lower-alpha',
 '大英文': 'upper-alpha',
 '小希腊': 'lower-greek',
 '小拉丁': 'lower-latin',
 '大拉丁': 'upper-latin',
 '希伯来': 'hebrew',
 '亚美尼亚': 'armenian',
 '乔治亚': 'georgian',
 '中文国字数字': 'cjk-ideographic',
 '平假名': 'hiragana',
 '片假名': 'katakana',
}

var BORDER_WIDTH_T = {
 '薄': 'thin',
 '中等': 'medium',
 '厚': 'thick',
}

var BORDER_STYLE_T = {
 '隐藏': 'hidden',
 '点线': 'dotted',
 '虚线': 'dashed',
 '波浪线': 'wavy',
 '实线': 'solid',
 '双线': 'double',
 '凹槽': 'groove',
 '脊': 'ridge',
 '陷入': 'inset',
 '突出': 'outset',
}

var BORDER_COLLAPSE_T = {
 '分开': 'separate',
}

var COLLAPSE_T = {
 '合并': 'collapse',
}

var BORDER_IMAGE_SLICE_T = {
 '填满': 'fill',
}

var SPAN_T = {
 '跨越': 'span',
}

var MAX_MIN_CONTENT_T = {
 '最大内容': 'max-content',
 '最小内容': 'min-content',
}

var AUTO_T = {
 '自动': 'auto',
}

var BALANCE_T = {
 '平衡': 'balance',
}

var EMPTY_CELLS_T = {
 '藏': 'hide',
 '展示': 'show',
}

var BORDER_IMAGE_REPEAT_T = {
 '拉伸': 'stretch',
 '重复': 'repeat',
 '缩放': 'round',
 '扩展': 'space',
}

var VISIBILITY_T = {
 '可见': 'visible',
 '隐藏': 'hidden',
}
var OVERFLOW_T = {
 '滚动': 'scroll',
}
var OVERFLOW_XY_T = {
 '无示显': 'no-display',
 '无内容': 'no-content',
}

var DISPLAY_T = {
 '块': 'block',
 '内联': 'inline',
 '内联块': 'inline-block',
 '列表项': 'list-item',
 '磨合': 'run-in',
 '表格': 'table',
 '内联表格': 'inline-table',
 '表格行组': 'table-row-group',
 '表格头组': 'table-header-group',
 '表格脚组': 'table-footer-group',
 '表格行': 'table-row',
 '表格列组': 'table-column-group',
 '表格列': 'table-column',
 '表格单元': 'table-cell',
 '表格标题': 'table-caption',
 '弹性': 'flex',
 '内联弹性': 'inline-flex',
}

var POSITION_STYLE_T = {
 '绝对': 'absolute',
 '固定': 'fixed',
 '相对': 'relative',
 '静': 'static',
 '粘': 'sticky',
}
var WORD_BREAK_T = {
 "全断": "break-all",
 "全保留": "keep-all",
}
var WRITING_MODE_T = {
 "水平上下": "horizontal-tb",
 "垂直右左": "vertical-rl",
 "垂直左右": "vertical-lr",
 "侧面右左": "sideways-rl",
 "侧面左右": "sideways-lr",
}
var CURSOR_T = {
 '默认': 'default',
 '十': 'crosshair',
 '指针': 'pointer',
 '移动': 'move',
 '右改': 'e-resize',
 '右上改': 'ne-resize',
 '左上改': 'nw-resize',
 '上改': 'n-resize',
 '右下改': 'se-resize',
 '左下改': 'sw-resize',
 '下改': 's-resize',
 '左改': 'w-resize',
 '文': 'text',
 '等': 'wait',
 '帮助': 'help',
};
var ANIMATION_ITERATION_COUNT_T = {
 '无限': 'infinite',
};
var ANIMATION_TIMING_FUNCTION_T = {
 '线性': 'linear',
 '低速': 'ease',
 '低速开始': 'ease-in',
 '低速结束': 'ease-out',
 '低速开始结束': 'ease-in-out',
};
var ANIMATION_DIRECTION_T = {
 '反向': 'reverse',
 '交替': 'alternate',
 '交替反向': 'alternate-reverse',
};
var ANIMATION_FILL_MODE_T = {
 '向前': 'forwards',
 '向后': 'backwards',
 '双方': 'both',
};
var ANIMATION_PLAY_STATE_T = {
 '暂停': 'paused',
 '运行': 'running',
};

var AT_COUNTER_STYLE_SYSTEM_T = {
 '循环': 'cyclic',
 '固定': 'fixed',
 '符号': 'symbolic',
 '字母': 'alphabetic',
 '数字': 'numeric',
 '添加': 'additive',
 '扩展': 'extends',
};

var JUSTIFY_CONTENT_T = {
 "弹性开始":"flex-start",
 "弹性结束":"flex-end",
 "中":"center",
 "间隔空间":"space-between",
 "均匀空间":"space-evenly",
 "周边空间":"space-around",
 '拉伸': 'stretch', // for align-content
 '基线': 'baseline',  // for align-self
}

var CONTENT_T = {
 "开引号": "open-quote",
 "关引号": "close-quote",
 "无开引号": "no-open-quote",
 "无关引号": "no-close-quote",
}

名称

中文名	英文名
背景色	background-color
背景图	background-image
背景重复	background-repeat
背景附件	background-attachment
背景位置	background-position
背景混合模式	background-blend-mode
背景裁剪	background-clip
背景原点	background-origin
背景尺寸	background-size
背景	background
字体族	font-family
字体号	font-size
字体样式	font-style
字体变形	font-variant
字体粗细	font-weight
字体	font
列表样式图	list-style-image
列表样式位置	list-style-position
列表样式标记	list-style-type
列表样式	list-style
框宽	border-width
框样式	border-style
框颜色	border-color
框圆角	border-radius
框合并	border-collapse
框	border
框底宽	border-bottom-width
框底样式	border-bottom-style
框底颜色	border-bottom-color
框底左圆角	border-bottom-left-radius
框底右圆角	border-bottom-right-radius
框底	border-bottom
框上宽	border-top-width
框上样式	border-top-style
框上颜色	border-top-color
框上左圆角	border-top-left-radius
框上右圆角	border-top-right-radius
框上	border-top
框左宽	border-left-width
框左样式	border-left-style
框左颜色	border-left-color
框左	border-left
框右宽	border-right-width
框右样式	border-right-style
框右颜色	border-right-color
框右	border-right
框图源	border-image-source
框图内移	border-image-slice
框图宽	border-image-width
框图突出	border-image-outset
框图重复	border-image-repeat
框图	border-image
框间距	border-spacing
轮廓颜色	outline-color
轮廓样式	outline-style
轮廓宽	outline-width
轮廓偏移	outline-offset
轮廓	outline
边缘	margin
边缘下	margin-bottom
边缘左	margin-left
边缘右	margin-right
边缘上	margin-top
内衬	padding
内衬下	padding-bottom
内衬左	padding-left
内衬右	padding-right
内衬上	padding-top
颜色	color
方向	direction
字母间距	letter-spacing
行高	line-height
文对齐	text-align
文最后对齐	text-align-last
文修饰	text-decoration
文修饰样式	text-decoration-style
文缩进	text-indent
文阴影	text-shadow
文转换	text-transform
文溢出	text-overflow
文双向	unicode-bidi
垂直对齐	vertical-align
空白	white-space
字间距	word-spacing
高	height
最大高	max-height
最大宽	max-width
最小高	min-height
最小宽	min-width
宽	width
可见	visibility
显示	display
定位	position
下	bottom
剪裁	clip
光标	cursor
左	left
右	right
上	top
溢出	overflow
溢出横	overflow-x
溢出竖	overflow-y
叠序	z-index
浮动	float
清除	clear
动画名称	animation-name
动画时长	animation-duration
动画时间函数	animation-timing-function
动画延迟	animation-delay
动画播放次数	animation-iteration-count
动画方向	animation-direction
动画填充模式	animation-fill-mode
动画播放状态	animation-play-state
动画	animation
转换	transform
转换原点	transform-origin
转换样式	transform-style
鼠标事件	pointer-events
系统	system
负数	negative
折行	word-wrap
方框尺寸	box-sizing
弹性	flex
弹性扩展	flex-grow
弹性收缩	flex-shrink
弹性基准	flex-basis
弹性流	flex-flow
弹性方向	flex-direction
改尺寸	resize
横向内容排列	justify-content
纵向项目排列	align-items
内容	content
透明度	opacity
过渡属性	transition-property
过渡时长	transition-duration
过渡时间函数	transition-timing-function
过渡延迟	transition-delay
过渡	transition
纵向内容排列	align-content
纵向自己排列	align-self
全部	all
外观	appearance
背面可见	backface-visibility
方框阴影	box-shadow
标题位置	caption-side
弹性换行	flex-wrap
列数	column-count
列填充	column-fill
列颜色规则	column-rule-color
列样式规则	column-rule-style
列宽度规则	column-rule-width
列规则	column-rule
列跨越	column-span
列宽	column-width
列	columns
计数器递增	counter-increment
计数器重置	counter-reset
空单元格	empty-cells
滤镜	filter
混合模式	mix-blend-mode
对象适应	object-fit
对象位置	object-position
顺序	order
后分页符	page-break-after
前分页符	page-break-before
中分页符	page-break-inside
透视	perspective
透视原点	perspective-origin
引号	quotes
表格布局	table-layout
断词	word-break
书写模式	writing-mode
列间隙	column-gap
行间隙	row-gap
间隙	gap
网格列开始	grid-column-start
网格列结束	grid-column-end
网格列	grid-column
网格行结束	grid-row-end
网格行开始	grid-row-start
网格区域	grid-area
网格自动列宽	grid-auto-columns
网格自动行高	grid-auto-rows
网格自动布局	grid-auto-flow
网格列间隙	grid-column-gap
网格行间隙	grid-row-gap
网格间隙	grid-gap
网格模板行	grid-template-rows
网格模板列	grid-template-columns
网格模板区域	grid-template-areas
网格模板	grid-template
网格	grid

动画时间函数

贝塞尔	cubic-bezier
步数	steps
开始	start
结束	end

关键帧

从	from
到	to

转换

矩阵	matrix
矩阵3维	matrix3d
转化	translate
转化3维	translate3d
转化横	translateX
转化竖	translateY
缩放	scale
缩放3维	scale3d
缩放横	scaleX
缩放竖	scaleY
缩放深	scaleZ
旋转	rotate
旋转3维	rotate3d
旋转横	rotateX
旋转竖	rotateY
旋转深	rotateZ
倾斜	skew
倾斜横	skewX
倾斜竖	skewY
透视	perspective
矩行	rect

选择器

后	after
前	before

元素选择器

视图	view
页面	page
@字符集	@charset
@计数样式	@counter-style
@字体	@font-face
@字体特征值	@font-feature-values
@导入	@import
@关键帧	@keyframes
@媒体	@media
@名称空间	@namespace
@页面	@page
@支持	@supports
锚	a
文本域	textarea
表单	form
按钮	button

参考