CSS
2016-08-19 14:17:03 17 举报
AI智能生成
CSS,全称为“层叠样式表”(Cascading Style Sheets),是一种用于描述网页外观和格式的标记性语言。它通过将样式(如字体、颜色、间距和对齐等)分离出来,使得网页结构和表现形式得以分离,提高了网页的可维护性和可重用性。CSS不仅可以精确控制网页元素的位置和样式,还可以实现许多复杂的效果,如动画、过渡和滤镜等。此外,CSS还支持媒体查询,可以根据设备的屏幕尺寸和方向来应用不同的样式。总的来说,CSS是构建响应式和用户友好的网站的关键工具。
作者其他创作
大纲/内容
背景
background-image
background-repeat 平铺
background-attachment 背景固定
background-position 背景移动
background-color
background-origin 开始位置
background-cilp 裁剪范围
background-size 图像大小(固定)
gradient 渐变
repeating-*-gradient()
linear-gradient()
radial-gradient()
盒模型
box-shadow 阴影
outline 轮廓
content 内容
width 宽度
heigth 高度
padding 内填充
top填充
rigth 填充
bottom 填充
left 填充
box-sizing
border-box 设置外边框为盒子
content-box 设置内容区为盒子
margin 外边距
top 边距
rigth 边距
bottom 边距
left 边距
border 边框
width 宽度
top
rigth
bottom
left
style 边框样式
color 颜色
border-radius 形状
overflow 溢出
visible 直接显示
hidden 隐藏
scroll 滚屏
auto 自动
布局
display 显示方式
inline 内联
block 块元素
none 隐藏消失
position 定位
relative 相对定位
absolute 绝对定位
fixed 固定定位
float 浮动
left 左浮动
right 右浮动
flex 弹性布局
flex-direction 排列方向
flex-wrap 换行
order 排列顺序
flex-basis 宽度分配
flex-grow 剩余宽度分配
flex-shrink 超出宽度分配
css选择器
基本选择器
元素选择器 elementname
类选择器 .classname
ID选择器 #idname
通配选择器 *
属性选择器
[ attr ]
[ attr = val ]
[ attr ~= val ]
[ attr |= val ]
[ attr ^= val ]
[ attr $= val ]
[ attr *= val ]
组合选择器
相邻兄弟选择器 A + B
通用兄弟选择器 A ~ B
子选择器 A > B
后代选择器 A B
伪类选择器
常用
:link, :visited
:hover, :active
:disabled
:checked
child选择器
:first-child
:last-child
:nth-child()
:nth-last-child()
:only-child
type选择器
:first-of-type
:last-of-type
:nth-of-type()
:nth-last-of-type()
:only-of-type
不常用
:empty
:root
:not
:target
:lang
伪元素选择器
::before
::after
::first-letter
::first-line
::selection
动画
transition 过渡
transition-property 过渡属性
transition-duration 过渡时间
transition-timing-function 时间函数
transition-delay 延时
animation 动画
animation-name 动画类型
animation-duration 动画时间
animation-timing-function 时间函数
animation-delay 延时
animation-iteration-count 循环次数
animation-direction 循环方向
animation-play-state 状态
animation-fill-mode 始末状态
文本
字体
font-size 字体大小
font-family 字体样式
font-weight 字体粗细
font-style 字体倾斜
line-height 行距
color 字体颜色
对齐
text-align
vertical-align 垂直对齐
text-indent 首行缩进
格式
white-space 格式换行
word-wrap 自动换行
word-break 单词换行
文本修饰
text-shadow 文字阴影
text-decoration 下划线
高级设置
text-overflow 超长文本显示
cursor 按钮
inherit 继承
变形
transform 旋转
translate 移动
scale 放大
skew 形变
transform-origin
perspective 透视旋转
perspective-origin
backface-visibility
transform-style
0 条评论
下一页