css选择器优先级和页面布局及css拓展

今天学习了CSS选择器的优先级和关于ps的一些界面快捷键和一些用法,然后通过对100度享乐网的布局使我们对布局的意识更加清晰。

关于CSS选择器的优先级:作用的元素相同,样式相同就会出现优先级问题。

当优先级相同的时候,代码发生冲突时后面的代码覆盖前面的代码

不同选择器发生冲突时,优先级高的选择器覆盖优先级低的

通配选择器 0

*标签名选择器 1

*类选择器 10 优先级绝对高于标签名选择器

*id选择器 100 优先级绝对高于类选择器

*后代选择器 选择器1 选择器2 选择器3...(优先级会有相加的过程)

*群组选择器 选择器1,选择器2,选择器3...(不会有优先级相加的过程)


可以通过CSS选择器的优先级由高到低进行排列:

1.无条件优先的属性只需要在在属性后面加上!important,他会覆盖页面内任何定义的元素样式,但要慎用,使用的时候记得加注释说明一下。

2.第二是在HTML中给元素中加style,但次方法有违文档中结构与样式分离的规范,不利于维护

3.第三是id选择器

4.第四级的属性由一个或多个 类选择器、属性选择器、伪类选择器定义。

5.第五是标签选择器

6.第六是通配选择器

ps的一些快捷键

command + h 是否显示额外内容(参考线);

v 移动工具

M 选取工具

z 放大镜工具 按住alt切换到缩小

t 取色

command+shift+c 强复制

command+ n 新建图层

command+shift+ alt +s 保存图片

command+ v 粘贴

100度页面布局



页面布局


拓展: reset.css

什我们可以把它叫做CSS重设,也有人叫做CSS复位、默认CSS、CSS重置等。CSS重设就是由于各种浏览器解释CSS样式的初始值有所不同,导致设计师在没有定义某个CSS属性时,不同的浏览器会按照自己的默认值来为没有定义的样式赋值,所以我们要先定义好一些CSS样式,来让所有浏览器都按照同样的规则解释CSS,这样就能避免发生这种问题。

normalize.css

保护有用的浏览器默认样式而不是完全去掉它们

一般化的样式:为大部分HTML元素提供

修复浏览器自身的bug并保证各浏览器的一致性

优化CSS可用性:用一些小技巧

解释代码:用注释和详细的文档来

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值