css学习笔记2---张孝祥视频

本文详细介绍了CSS中各种滤镜效果的应用方法及其参数设置,包括Alpha、BlendTrans、Blur等,并解释了如何通过CSS-P来精确控制网页元素的位置。此外还探讨了列表样式的配置选项。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Filter滤镜
参数:
Alpha(Opacity-? ,FinishOpacity=? ,Style=?,StartX=?,StartY=?(渐变透明效果的开始坐

标),FinishX,FinishY)
BlendTrans(Duration=?)
Blur(Add=?,Direction(值45的整数倍,0表示垂直向上),Strength)
Chroma(Color=(要过滤掉的某种颜色)
DropShadow(Color,Offx,OffY,Positive,)
FilpH FlipV Gray Invert Light(光源在物体上的投影效果) Xray
Glow(Color Strength (用于设置指定颜色边缘发光))
Mask(Color)在指定颜色上遮罩
RevealTrans(Duration,Transition)
Shadow(Color,Direction(45的整数倍))建立阴影效果
Wave(Add,Freq,LightStrength,Phase,Strength)波纹效果

位置:
位置属性就是指定元素的位置,它是CSS-P中的内容,CSS-P是CSS的一个扩展,它可用来控制任何网页元

素在浏览器文档窗口中的位置
Position(设置值:absolute relative static )
left ...

边缘:
margin(margin-top margin-right margin-bottom margin-left)
例如:P{margin:2em 4em}(表示上下边界距离外部2em ,左右则是4em,em表示当前自己的大小的位数)
padding(padding-top padding-right padding-bottom padding-left)用于设置元素边界与内部内容的

空隙大小
boder-width 用于设置元素边框的宽度(border-top-width ,border-right-width,border-bottom-

width,border-left-width)
boder-color与上一个类似
border-style 设置值:none dotted dashed solid double groove ridge inset outset
border(border-top ,border-right,border-bottom,border-left)
例如:A:active{border:thick double red}

列表:
list-style-type:
设置值:disc(实心圆),circle(空心圆),square(方块) ,decimal(阿拉伯数字),lower-roman(小写罗

马数字),upper-roman(大写罗马数字) none(无项目符号)
list-style-image
list-style-position:
设置值:inside ,outside
设置inside效果显示:
*主题1
这是主题内容
*主题2
设置outside
内容与星号对齐
list-style

其它属性:
Cursor:设置鼠标移动到某处光标的形状

样式规则的注释:不能嵌套
样式规则的继承:所有嵌套在某个HTML标签中的HTML标签都会继承外层标签设置的样式规则
样式规则的优先级:ID选择器>CLASS选择器>HTML标签选择器
内联样式表>嵌入样式表>链接样式表
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值