CSS-2

最新推荐文章于 2024-10-13 19:30:05 发布
最新推荐文章于 2024-10-13 19:30:05 发布
阅读量348 收藏 3
点赞数 7
文章标签： css 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Nozomi9967/article/details/141996645
版权

1.像素

2.颜色

rgba   ---  (255,255,255,0)   ---        a是透明度

hexa  ---   #ff00aabb        --        a是透明度 

hsla    ---   hsla(色相，饱和度，亮度，透明度)      ---       a依旧

3.字体

 

 

4.文本 

 

 

 

 

5.列表相关属性

 6.边框相关属性

7.表格相关属性

8.背景相关属性

9.鼠标相关属性

 10.css盒子模型

 

 

 

1.盒子的内容区 

2.盒子的内边距 

 

3.盒子的边框

 

4.盒子的外边距

 

 5.margin塌陷问题

6.margin合并问题

 

Nozomi9967
关注
css-pro-layout：CSS库，用于构建响应式和可自定义的布局
02-03
CSS Pro布局 CSS库，用于构建响应式和可自定义的...import 'css-pro-layout/dist/css/css-pro-layout.css' ; CDN 您也可以使用的CDN链接 < link href =" https://unpkg.com/css-pro-layout/dist/css/css-pro-layout
postcss-prefix-selector:使用选择器为所有CSS规则添加前缀
05-12
$ npm install postcss-prefix-selector 与PostCSS结合使用 const prefixer = require ( 'postcss-prefix-selector' ) // css to be processed const css = fs . readFileSync ( "input.css" , "utf8" ) const out ...
关于postcss-px2rem配置
一个小乞丐的博客
07-03 4932
vue postcss-px2rem配置 1、先安装postcss-plugin-px2rem npm install postcss-px2rem postcss postcss-loader --save 2、在webpack.base.conf.js添加这句代码 const webpack = require('webpack') 3、根据下面的图加入这两段代码段 { test: /\.scss$/, loaders: ['style-loader', 'css-load
PostCSS plugin postcss-uniapp-plugin requires PostCSS 8
拿回忆下酒
09-27 5822
Syntax Error: Error: PostCSS plugin postcss-uniapp-plugin requires PostCSS 8. Migration guide for end-users: https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users
postcss-px2rem-exclude配置 postcss.config.js无效
PC_136的博客
05-25 5181
之前做移动端的时候，网上搜索px转rem的插件 发现postcss-px2rem-exclude挺好用，只要配置下postcss.config.js就行 module.exports = { 'plugins': { 'postcss-px2rem-exclude': { remUnit: 75, exclude: /node_modules|folder_name/i } } } 发现没有效果，然后然后百度网上资料发现发现。。。 需要注意的是：上述
【postcss】解决vite中使用postcss-px-to-viewport无法使用vant等多种设计尺寸问题|postcss-plugins
页面仔的博客
04-13 1万+
vite中使用postcss-px-to-viewport适配vant的375和自己的750等其他设计尺寸
postcss-loader
qq_41893334的博客
05-21 9551
1.什么是PostCSS? https://www.postcss.com.cn/ PostCSS和sass/less不同, 它不是CSS预处理器 PostCSS是一款使用插件去转换CSS的工具， PostCSS有许多非常好用的插件 例如 autoprefixer(自动补全浏览器前缀) postcss-pxtorem(自动把px代为转换成rem) … … 2.使用PostCSS自动补全浏览器前缀 2.1安装postcss-loader npm i -D postcss-loader 2.2安装需要的插件 n
uni-app配置postcss-px-to-viewport
qq_20229759的博客
11-03 2023
uni-app 配置postcss-px-to-viewport
postcss-plugin-px2rem和postcss-px2rem-exclude使用方法
qq_33144001的博客
09-19 1万+
npm i postcss-px2rem-exclude -D 链接：https://www.npmjs.com/package/postcss-px2rem-exclude .postcssrc.js module.exports = { 'plugins': { 'postcss-px2rem-exclude': { remUnit: 75, pro...
前端聚光灯效果-(css-doodle)
热门推荐
weixin_62650212的博客
12-15 1万+
css-doodle 是一个基于 Web-Component 的库。允许我们快速的创建基于 CSS Grid 布局的页面，以实现各种 CSS 效果（或许可以称之为 CSS 艺术）。下面是一个使用css-doodle库实现的一个聚光灯的效果。效果如下：（点击可以刷新）
vue-cli 3.0中使用postcss-px-to-viewport或postcss-pxtorem实现移动端自动适配
一捆铁树枝的博客
08-10 2349
postcss-pxtorem和postcss-px-to-viewport都是PostCSS的插件，用于将像素单元生成rem单位或者vw单位。 前端开发还原设计稿的重要性毋庸置疑，目前应用的单位最多还是rem,然而每次在制作过程中需要自己计算rem值，为了能够直接按照设计图的尺寸开发，并且能自动编译转换成rem，下面就来分享下postcss-pxtorem的使用。 1.安装依赖 npm install postcss postcss-loader postcss-pxtorem -D 2.设置规
postcss-px2rem简单使用
weixin_45762331的博客
11-21 6942
postcss-px2rem简单使用 public/index.html下 <script> const baseSize = 100 // 基准值 function setRem() { // 相对于1920像素的缩放比 let scale = document.documentElement.clientWidth / 1920 // 根据屏幕变化 1rem 对应的 font-size scale = scale >
postcss-windicss:Windi CSS的PostCSS集成
04-01
postcss-windicss :test_tube: 过期的。 :warning: 不鼓励使用此软件包，因为PostCSS的API存在一些限制。 将我们用于每个专用框架/构建工具，以获取最佳的开发经验和性能。 该插件应该是使用Windi CSS的最后选择...
postcss-html：用于解析HTML（和类似HTML）的PostCSS语法
02-04
npm install postcss-syntax postcss-html --save-dev 如果要支持SCSS / SASS / LESS / SugarSS语法，则需要安装相应的模块。 SCSS： SASS： ： 糖SS： 用例 const postcss = require ( 'postcss' ) ; const ...
postcss-custom-properties:在CSS中使用自定义属性
04-22
PostCSS自定义属性 使您可以按照规范在CSS中使用自。 :root { --color : red;... const postcssCustomProperties = require ( 'postcss-custom-properties' ) ; postcssCustomProperties . process ( YOUR_
使用纯CSS和JavaScript来实现一个转盘抽奖效果
weixin_46328739的博客
10-10 750
使用纯CSS和JavaScript来实现一个转盘抽奖效果,抽到机率相同。
CSS3-Day1
m0_74039531的博客
10-10 901
CSS3圆角CSS3盒阴影box-shadowCSS3边界图片CSS3 background-clip属性padding-box 沿着边框填充content-box 在边框外面。
使用scss生成旋转圆圈
最新发布
qq_41893686的博客
10-13 291
【代码】使用scss生成旋转圆圈。
CSS @规则(At-rules)系列详解___@charset规则使用方法
逆境清醒的博客
10-11 1067
CSS @规则(At-rules)系列详解___@charset规则使用方法
css-in-css
02-05
2. CSS-in-JS：CSS-in-JS是一种将CSS样式直接写在JavaScript代码中的方式。它通过使用JavaScript对象来描述样式规则，并在运行时动态生成对应的CSS。常见的CSS-in-JS库有styled-components、Emotion等。 3. CSS ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值