2 posts tagged with "css"

View All Tags

5个技巧助你成为 CSS 大神

峰华

峰华

前端工程师 / B站UP主

B 站视频 - 点击传送

简介

作为一名前端工程师,经常在写完 HTML 以后,才觉得真正的噩梦要开始了,啊,写 CSS 的时候,面对满屏乱飞的组件,真想手动给他们挪到该在位置上……

都说 CSS 很难掌握,最愁给页面编写样式,其实都是因为还没有形成一个对 CSS 宏观的了解,只要有了正确的学习方法、设计思维,再通过不断的积累,就能轻松的掌握它。接下来我会把掌握 CSS 的 5 个技巧整理一下,让你在以后编写 CSS 的时候不再发愁。

样式调整

CSS 最基本的功能就是调整 HTML 的样式,可以设置元素的宽高、字体的颜色、大小和间距、背景颜色或图片等。这些跟传统的富文本编辑器比如 word 是一样的效果。有些属性可以一次性设置多个项目,比如background可以同时设置:

  • background-color
  • background-image
  • background-origin
  • background-position
  • ...等等

action

业余时间经常到像 mdn 之类的文档网站上去查它们的用法,能长不少见识。

CSS 选择器优先级(特异性、权重)详解

峰华

峰华

前端工程师 / B站UP主

在写 CSS 的时候你一定遇到过有些样式明明写对了,也选择了正确的 html 元素去应用这些样式,可是就是不生效,这是为什么呢?因为在选择同一个 HTML 元素的时候,不同的选择器有不同的优先级,优先级低的选择器的样式会被优先级高的覆盖。

什么是 CSS 选择器优先级

CSS 选择器优先级,也叫特异性,是指在给 HTML 元素应用样式时,如果有多个 CSS 选择器同时指向了这个元素,那么优先级高的选择器的样式会最终应用到这个元素上。