CSS

大家好，我是树哥！ 前面一篇文章整体介绍了 CSS 的布局知识，其中说到 float 布局是 CSS 不断完善的副产物。而在 2023 年的今天，flex 这种布局方式才是未来！那么今天我们就来学习下 flex 弹性布局。 什么是 Flex 布局？ 在经过了长达 10 年的发展之后，CSS3 才终于 ... »

很早之前，就写过一篇与原生嵌套相关的文章 -- CSS 即将支持嵌套，SASS/LESS 等预处理器已无用武之地？，彼时 CSS 原生嵌套还处于工作草案 Working Draft (WD) 阶段，而今天（2023-09-02），CSS 原生嵌套 Nesting 终于成为了既定的规范！ CSS 原生 ... »

盒子模型 1.是什么 2.边框 边框的粗细 边框的样式 边框的颜色 因为容易很丑~-~ 这里用结构伪类选择器: ——本意为找div父类的子类中第一个为input的，但是有错，实际上是div的后代选择器 如果去掉input , 只会框第一个div, 找div父类的子类中第一个孩子 3.外边距 两个参数 ... »

>我们是[袋鼠云数栈 UED 团队](http://ued.dtstack.cn/)，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。 >本文作者：琉易 [liuxianyu.cn](https://link.juejin.cn/?target=ht ... »

# 前言 在网页设计和前端开发中，CSS属性是非常重要的一部分。掌握常用的CSS属性不仅可以使你的网页看起来更美观，还能提升用户体验，今天小编为大家介绍8个常见的CSS小技巧： # 1.修改滚动条样式 下图是我们常见的滚动条，现在需要改变滚动条的宽度和颜色了，并把它画的圆一点。 ![](https: ... »

在 CSS 中，存在许多数学函数，这些函数能够通过简单的计算操作来生成某些属性值，例如在[现代 CSS 解决方案：CSS 数学函数](https://github.com/chokcoco/iCSS/issues/177)一文中，我们详细介绍了 + calc()：用于计算任意长度、百分比或数值型数据 ... »

原子化 CSS 框架 我记得很久之前有时候为了少写些css，我们通常会有如下的样板代码 .block { display: block; } .flex { display:flex } .flex-center { align-items: center; justify-content: cen ... »

本文，我们将一起学习，使用纯 CSS，实现如下所示的动画效果：  上面的动画效果，非常有意思，核心有两点： 1. 小球随 ... »

一、介绍最近在一个项目的宣传页中，设计师使用了文字描边效果，之前我确实没有实现过文字的描边效果，然后我在查阅资料后，知道了实现方法。文字描边分为两种：内外双描边和单外描边，也就是指在给文字加上描边效果后，描边的方向是向内外同时占用文字空间还是只向外扩充文字空间的区别。 二、具体代码1、文字内外双描边 ... »

>我们是[袋鼠云数栈 UED 团队](http://ued.dtstack.cn/)，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。 >本文作者：[霜序](https://luckyfbb.github.io/blog) ## 前言 在前一篇文章中 ... »

> 嵌套是使用Sass等CSS预处理器的核心原因之一。现在，该功能已经以类似的语法出现在标准浏览器CSS中。你能否在构建系统时放弃对预处理器的依赖？ CSS嵌套可以节省输入时间，并使语法更易于阅读和维护。迄今为止，你必须像这样键入完整的选择器路径： ```css .parent1 .child1, ... »

博客推行版本更新，成果积累制度，已经写过的博客还会再次更新，不断地琢磨，高质量高数量都是要追求的，工匠精神是学习必不可少的精神。因此，大家有何建议欢迎在评论区踊跃发言，你们的支持是我最大的动力，你们敢投，我就敢肝 ... »

CSS (Cascading Style Sheets) 是一种样式表语言，用于描述HTML元素的样式。CSS选择器是CSS规则的一部分，它决定了CSS规则应用于哪些元素。在网络爬虫的开发中，我们经常使用CSS选择器来定位和选取HTML元素。 以下是一些常见的CSS选择器： ## 1. 元素选择器 ... »

博客推行版本更新，成果积累制度，已经写过的博客还会再次更新，不断地琢磨，高质量高数量都是要追求的，工匠精神是学习必不可少的精神。因此，大家有何建议欢迎在评论区踊跃发言，你们的支持是我最大的动力，你们敢投，我就敢肝 ... »

# 综合案例一-热词 [TOC] 设计图如下  ## 1、设计需求 ①需要鼠标放上去有显示透明 ②需要点击后跳转到相应页面且保留原页面 ## 2、设计所需标 ... »

# css_margin塌陷问题 ### 问题描述 ```html ``` 当**child1**设置了margin-top时，margin-top会作用在father上 当**child2**设置了margin——bottom时，margin-bottom会作用在father上 ### 解决方法 ... »

### css引入 1. 内联样式 ```css 我是div元素 ``` 2.内部样式 ```css ``` 3. 外部样式 ```css /* 可以通过@import引入其他的css资源 */ @import url(./style.css); @import url(./test.css); . ... »

# 第1章 CSS简介 ## 1.1 HTML的局限性 1. **HTML是一个非常单纯的东西，只关注内容的语义** ## 1.2 CSS—网页的美容师 1. **CSS是层叠样式表的简称。** 2. 有时我们也会称为CSS样式表和级联样式表。 3. CSS也是一种标记语言。 4. CSS主要用于设 ... »

>我们是[袋鼠云数栈 UED 团队](http://ued.dtstack.cn/)，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。。 >本文作者：琉易 [liuxianyu.cn](https://link.juejin.cn/?target=h ... »

## 如何实现两栏布局 实现两栏布局一般指的是左边固定,右边自适应,这里给出几个案例给大家参考 ![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/6ba3f53026e842dfa8690e286bf6c690~tplv-k ... »