我好像不会CSS
关注
分享
扫一扫
文章平均质量分 76
通过使用 CSS 我们可以大大提升网页开发的工作效率！
在我们的 CSS 教程中，您会学到如何使用 CSS 同时控制多重网页的样式和布局。
小绵杨Yancy
Trouble is a friend.
展开
-
【前端开发】CSS BEM命名规范
BEM其实是块（block）、元素（element）、修饰符（modifier）的缩写，利用不同的区块，功能以及样式来给元素命名。 通过bem规范来命名元素，可以使得我们对于元素的命名更加规范，见名知意，便于项目后期的维护和样式提取。这是饿了么官网的卡片组件的代码，我们来分析以下这个组件的命名。 首先对于BEM中的，更高级别的抽象或组件，这里是，表示饿了么的card卡片组件。Element代表 block 的后代(或者组成部分)，用于形成一个完整的 block 的整体。对于，它的Element有卡片头部、卡原创 2022-11-27 12:54:22 · 939 阅读 · 0 评论 -
【CSS】css变量
目录1、css变量2、实例 1、css变量 有的网站都会有自己的主题色，例如饿了么： 所以很对元素都会用到这些颜色，例如某些字体颜色，弹框提示颜色等等。 如果每次用到的时候，都使用十六进制的颜色表示，那么效率十分低，并且如果万一有一天需要更换主题颜色，那么一个一个更改，是十分繁琐的。 为了解决以上问题，css引入了变量。 CSS变量可以访问 DOM，可以创建具有局部或全局范围的变量，使用 JavaScript 和媒体查询来修改变量。var() 函数用于插入 CSS 变量的值。全局变量可以在整个文档进行访问原创 2022-05-23 12:12:38 · 14371 阅读 · 2 评论 -
【CSS】opacity和rgba的区别
目录一、 opacity和rgba的使用1.1 opacity1.2 rgba二、区别 一、 opacity和rgba的使用 opacity和rgba都可以控制元素的透明度。 1.1 opacity mdn描述： opacity属性指定了一个元素的不透明度。换言之，opacity属性指定了一个元素后面的背景的被覆盖程度。 当opacity属性的值应用于某个元素上时，是把这个元素（包括它的内容）当成一个整体看待，即使这个值没有被子元素继承。因此，一个元素和它包含的子元素都会具有和元素背景相同的透明度，哪怕这原创 2022-05-21 20:20:34 · 649 阅读 · 1 评论 -
【CSS】盒子模型以及负边距的使用
目录一、盒子模型1、盒子内部结构2、盒子之间的相互影响二、负margin1、自适应布局双飞翼布局圣杯布局2、图片与文字对齐3、元素居中 一、盒子模型 在“css盒子模型”理论中，页面中所有元素都可以看成一个个盒子，并且占据这一定的页面空间。 一个页面由许多的盒子组成，这些盒子之间也会互相影响，因此我们需要从两方面深入了解盒子模型： 每个盒子的内部结构 多个盒子之间的影响关系 1、盒子内部结构 可以看到，由内容区（content）、内边距（padding）、边框（border）和外边距（margin原创 2022-04-10 10:43:59 · 1363 阅读 · 0 评论 -
【CSS】文字内容过长，使用省略号代替
目录一 、 问题二 、解决1、只保留一行2、保留多行 一 、 问题 有时候我们可能会遇到段落问题过长而溢出固定区域的问题。遇到过很多次，都是直接cv解决了，今天记录一下解决方法。 例如： <div class="box"> <p class="inner">JavaScript（简称“JS”） 是一种具有函数优先的轻量级， 解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名， 但是它也被用到了很多非浏览器环境中，JavaScript原创 2022-04-08 13:25:39 · 2288 阅读 · 0 评论 -
CSS学习 — 一篇文章搞懂块级格式化上下文（BFC）
目录1、CSS常见问题（1）、外边距重叠（2）、浮动元素覆盖（3）、高度坍塌2、BFC3、使用BFC解决 1、CSS常见问题 在引入BFC之前，我们先来看一看几个常见的css布局问题。 （1）、外边距重叠 （2）、浮动元素覆盖 （3）、高度坍塌 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible"原创 2022-03-15 08:57:41 · 1197 阅读 · 0 评论 -
CSS学习 — CSS的引入以及CSS选择器
目录前言引入CSSCSS选择器复杂的css选择器 前言 CSS是Cascading Style Sheets的缩写，一般翻译为层叠样式表，是用来表现HTML(标准通用标记语言的一个应用）或XML(标准通用标记语言的一个子集）等文件样式的计算机语言。 通俗的说，我们通过css来美化、格式化我们的html标签，那么我们如何确定改修饰那一部分html标签呢，这就需要使用css选择器。 当然我们要修饰页面，肯定需要在hmtl文件中引入css。 引入CSS 在html中引入css的方式有三种： 行内样式 直接在ht原创 2022-02-13 18:36:42 · 460 阅读 · 0 评论 -
CSS学习 — 入门
目录前言学习CSScss进阶 前言 在前面的博客中重新回顾了html的知识，我们可以通过html来写出一个比较简单的网页。 如果仅仅只依靠html的标签来搭建网页，那么网页将会是这样的……（图片来源于zhihu） 面对这样的网页，着实没有再看下去的欲望了…… 那么我们将css加上以后，网页是这样的： 当我们按下f12，打开控制台，便可以看到css的“真面目”了。 学习CSS 所以对于一个网页来说，使用css来美化页面是十分重要的。在我看来，学习css，应该围绕： css选择器：类选择器、id选择器…原创 2022-02-12 22:13:57 · 307 阅读 · 0 评论