css
2019-12-13 12:41:33 14 举报
AI智能生成
cgss
作者其他创作
大纲/内容
写在哪
style属性
样式没有复用性
style标签
选择器
单个选择器
id
class
tag
通配符*
最低
复合
相邻
,
父子
空格
只包含一层子元素
>
优先级
复合>单个
#div div
#div .a
a
css文件中
link
优先级
以什么样式进行显示
常用样式
对于当个元素来说的样式
border
边框
border复合样式
borderstyle
参数的个数
bordercolor
参数的个数
borderwidth
参数的个数
bordertop
颜色 线型 粗细
border-top-style
border- top -color
border- top-width
border-bottom
border-left
border-right
border-collapse:collapse
去掉 th/td table间距
border-radius
圆角
css3
参数个数不同
boxshadow
css3
1左右2上下3距离4虚化5颜色
background
背景
background-color
background
渐变色
linear
background-image
url
子主题
元素比图片大
repeat
no-repeat
repeat-X
repeat-Y
图片比元素大
background-size
contain
cover
自己指定大小宽度
px %
css3
background-position
背景图的位置
font
字体
字体
font- family
字体主题
font-weight
100-900 400正常
font-style
font-size
colo
text
文本
text-dicoration:none
text-dicoration-line:ine-through
text- align
当前行内或行内块元素居中
word-warp;break word
元素内文本省略号
列表 list-style:none
表格 border-collapse
元素内部和元素的距离
padding
盒模型
content
padding
加大当前元素大小
5px 3 4
border
margin
子主题
元素和元素之间的样式
不同元素之间的距离
margin
竖直方向的外边距合并
margin-top
margin-auto
当前元素水平居中 (块级元素)
浏览器 默认的自带样式 8px *{}}
布局效果的样式
float
脱离文档流
要成为一行的元素 加浮动
left
right
没有空格
弹性布局
dispaly;flex
给外层分配空间的额元素 空白分隔
justify-content
space-between
space-around
换行
flex;wrap
空白在竖直方向上的分布
align-content
space-between
space-around
css3
display:inline-block
1空格
左对齐
display
none
inline
inline-block
行内块元素
block
flex
-webkit-box
元素位置
position
定位
static
relative
相对于自己原来的位置
absolute
脱离文档流
包含自己最近的元素做定位
fixed
忽略滚动条
top/left
子主题
一个元素在另一个元素中居中(水平和竖直)
0 条评论
下一页