HTML入门DAY14

优雅降级和渐进增强

优雅降级:一开始先正对高版本完成所有功能和酷炫效果,后面再单独针对低版本浏览器进行处理,以保证其完成最基本的功能即可。【向下兼容】
渐进增强:先针对低版本浏览器完成基本功能,然后再针对高版本浏览器添加更多功能和效果。

css3新增属性

1.文字阴影
text-shdow:x的偏移 y的偏移 模糊程度 颜色;
2.盒子阴影
box-shdow:x的偏移 y的偏移 模糊程度 延申半径 阴影颜色。inset代表内阴影,不加就是外阴影;
3.圆角半径
boder-reduis:px | %
如果是*%代表的是宽度和高度的百分比。
注意:如果要是正圆,必须宽高一样
4.背景图的大小
background-size:宽度 高度
注意:如果和background属性混用,必须复合background属性在前。
5.英文大小写转换
text-transform:capitalize首字母大写 | lowercase小写 | upperca 大写。

字体图标

1.使用阿里巴巴矢量图标库【iconfont】
2.使用自定义字体
@font-face{
font-family:’自定义字体名字‘
src:url(字体文件的路径);
}
使用的时候,设置对应内容的文字类型为自定义的名字即可。

属性选择器

1.属性选择器
选中有attr属性的元素e e[attr ]
选中有attr属性的元素e且属性值为v的元素e e[ attr=‘v’]
选中有attr属性的元素e且属性值以v开头的 e[ attr^=‘v’]
选中有attr属性的元素e且属性值以v结尾的 e[attr$=‘v’]
2.结构伪类选择器
e:first-child 选中第一个子元素e
e:last-child 选中最后一个子元素e
e:nth-child(n) 选中第n个子元素e
e:nth-last-child(n) 选中倒数第n个子元素e
n是一个乘法因子,可以是数字;英文(odd奇数,even偶数)
e:only-child 选中唯一的子元素e【用于场景判定】
注意:child系列强调的是该元素在其父元素的所有子元素的排序

结构伪类选择器

type系列强调的是该元素在同类型兄弟元素之间的排序。【将child改成of-type】

UI状态伪类选择器

e:disable 选中不可用元素e
e:enable 选中可用元素e
e:chenck 给选中的元素e

否定伪类选择器

e:not(f) 选中e中所有不满足条件f的剩余元素。

目标伪类选择器

e:target 当e为目标区域的时候,选中它

设置元素在z轴上的堆叠层次
z-index:数字;
值正负均可,大的覆盖小的。
每个元素默认的z-index的值为0.
必须给元素设置非静态定位改属性才能生效。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值