随笔分类 -  css&css预处理框架

css grid布局
摘要:<!DOCTYPE html><html><head><style> .grid-container { display: grid; grid-template-columns: auto auto auto auto; grid-gap: 10px; background-color: #219 阅读全文

posted @ 2023-01-31 11:40 漫思 阅读(19) 评论(0) 推荐(0) 编辑

设置浏览器显示小于12px以下字体的三种方法
摘要:设置浏览器显示小于12px以下字体的三种方法 使用场景: 以往设计图给的字号一般最小就是12px, 开发人员一般是使用谷歌浏览器来进行调试运行。谷歌浏览器上显示字体最小为12px,css设置font-size:10px,运行代码显示结果仍然是12px大小,但是挡不住甲方有时就是强调使用的字号,必须是 阅读全文

posted @ 2022-12-30 18:13 漫思 阅读(1067) 评论(0) 推荐(0) 编辑

网站都变成灰色了,它是怎么实现的?
摘要:网站都变成灰色了,它是怎么实现的? 沉默王二 已于 2022-12-02 12:53:08 修改 21821 收藏 453 分类专栏: 编程技术 文章标签: 前端 html java 于 2022-12-02 12:41:56 首次发布 榆枋不止 本文链接:https://blog.csdn.net 阅读全文

posted @ 2022-12-07 10:16 漫思 阅读(307) 评论(0) 推荐(0) 编辑

除了 filter 还有什么置灰网站的方式?
摘要:除了 filter 还有什么置灰网站的方式? 主要针对国家领导人去世的哀悼页面 大家都知道,当一些重大事件发生的时候,我们的网站,可能需要置灰,像是这样: 当然,通常而言,全站置灰是非常简单的事情,大部分前端同学都知道,仅仅需要使用一行 CSS,就能实现全站置灰的方式。 像是这样,我们仅仅需要给 H 阅读全文

posted @ 2022-12-02 15:43 漫思 阅读(47) 评论(0) 推荐(0) 编辑

细数那些惊艳一时的 CSS 属性
摘要:细数那些惊艳一时的 CSS 属性 前端大学 2022-11-29 16:00 发表于江苏 收录于合集 #css13个 #面试9个 作者:CatWatermelon https://juejin.cn/post/7155780555554947102 前言 随着前端的不断发展,更多新的 CSS 属性不 阅读全文

posted @ 2022-11-30 14:23 漫思 阅读(35) 评论(0) 推荐(0) 编辑

两行CSS让页面提升了近7倍渲染性能!
摘要:两行CSS让页面提升了近7倍渲染性能! 前言 对于前端人员来讲,最令人头疼的应该就是页面性能了,当用户在访问一个页面时,总是希望它能够快速呈现在眼前并且是可交互状态。如果页面加载过慢,你的用户很可能会因此离你而去。所以页面性能对于前端开发者来说可谓是重中之重,其实你如果了解页面从加载到渲染完成的整个 阅读全文

posted @ 2022-11-21 15:38 漫思 阅读(36) 评论(0) 推荐(0) 编辑

css让层水平垂直居中
摘要:.myDiv{ position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%) } 在父窗体上声明 <div style={{height:'100px',width:"100px",back 阅读全文

posted @ 2022-10-25 23:57 漫思 阅读(55) 评论(0) 推荐(0) 编辑

超强的苹果官网滚动文字特效实现
摘要:超强的苹果官网滚动文字特效实现 每年的苹果新产品发布,其官网都会配套更新相应的单页滚动产品介绍页。其中的动画特效都非常有意思,今年 iPhone 14 Pro 的介绍页不例外。 最近,刚好有朋友问到,其对官网的一段文字特效特别感兴趣,看适用简单却不知从何下手,我们来看看: 整个动画大致是,随着页面的 阅读全文

posted @ 2022-10-21 18:55 漫思 阅读(95) 评论(0) 推荐(0) 编辑

你真的知道flex: 1;是什么意思吗?
摘要:你真的知道flex: 1;是什么意思吗? 阳庚 已于 2022-04-27 10:47:28 修改 2420 收藏 7分类专栏: CSS 文章标签: css3版权 CSS专栏收录该内容5 篇文章0 订阅订阅专栏简单的来说一下在别人问你这个问题的时候怎么来回答它 前端新人,如有错误求大佬指出~求教💝 阅读全文

posted @ 2022-08-12 11:20 漫思 阅读(184) 评论(0) 推荐(0) 编辑

深入理解flex布局的flex-grow、flex-shrink、flex-basis
摘要:深入理解flex布局的flex-grow、flex-shrink、flex-basis 若愚 ​ 在饥人谷学前端、Java、Go、C++。 咨询见个人简介 ​关注他 129 人赞同了该文章 在使用 flex 布局的时候大家难以理解的是 flex-grow、flex-shrink、flex-basis 阅读全文

posted @ 2022-08-12 11:20 漫思 阅读(169) 评论(0) 推荐(0) 编辑

css 实现炫酷的条纹进度条效果
摘要:css 实现炫酷的条纹进度条效果 原创2022-06-14 16:47·前端石三 效果图: html: <!--进度条--> <div class="progress-wrap"> <div class="progress-inner"> <div class="progress-nums"></d 阅读全文

posted @ 2022-06-22 11:57 漫思 阅读(1597) 评论(0) 推荐(0) 编辑

42种前端常用布局方案
摘要:42种前端常用布局方案 原创2022-06-14 13:33·努力学习的前端码农 四十二种布局可以细分为如下几类: 水平居中 垂直居中 水平垂直居中 两列布局 三列布局 等分布局 Sticky Footer布局 全屏布局 水平居中 实现水平布局比较简单,方法也比较多,这里总结了7种常用的布局方法,其 阅读全文

posted @ 2022-06-17 19:02 漫思 阅读(459) 评论(0) 推荐(0) 编辑

自定义滚动条的样式
摘要:自定义滚动条的样式 P13G13 overflow:scroll /* x y 方向都会*/ 或者 overflow-x:scroll /*只是x方向*/ 或者 overflow-y:scroll /*只是y方向*/ 当我们在块级元素上设置这些css属性时,元素内容范围超出块级元素区域大小时,就根据 阅读全文

posted @ 2022-05-16 09:36 漫思 阅读(119) 评论(0) 推荐(0) 编辑

stiky可能出现的问题
摘要:stiky可能出现的问题 场景 可能出现的问题 1、底部靠底,有可能内容不到一屏,根本挤压不到底部 2、顶部靠顶的方案可以有一致性 3、 阅读全文

posted @ 2022-04-18 10:27 漫思 阅读(37) 评论(0) 推荐(0) 编辑

https://cssgradient.io/
摘要:https://cssgradient.io/ 在线css减变处理程序 阅读全文

posted @ 2022-04-12 16:36 漫思 阅读(44) 评论(0) 推荐(0) 编辑

css 阴影的原理
摘要: 阅读全文

posted @ 2022-04-08 18:24 漫思 阅读(31) 评论(0) 推荐(0) 编辑

对于渐变和背景的认知
摘要:CSS background 属性 | 菜鸟教程 (runoob.com) 先看这个教程 background: rgb(255,241,240); background: linear-gradient(180deg, rgba(255,241,240,1) 0%, rgba(255,255,25 阅读全文

posted @ 2022-04-08 18:23 漫思 阅读(30) 评论(0) 推荐(0) 编辑

css伪元素:before和:after用法详解
摘要:css伪元素:before和:after用法详解 css的伪元素,之所以被称为伪元素,是因为他们不是真正的页面元素,html没有对应的元素,但是其所有用法和表现行为与真正的页面元素一样,可以对其使用诸如页面元素一样的css样式,表面上看上去貌似是页面的某些元素来展现,实际上是css样式展现的行为,因 阅读全文

posted @ 2022-03-31 16:18 漫思 阅读(9959) 评论(0) 推荐(0) 编辑

如何让一个层垂直居中
摘要:如何让一个层垂直居中 position: absolute; top: 50%; left: 50%; 如何让一个层向上垂直居中 position: absolute; top: 50%; left: 50%; display: flex; align-items: center; justify- 阅读全文

posted @ 2022-03-09 20:22 漫思 阅读(25) 评论(0) 推荐(0) 编辑

PC 端网页特效
摘要:PC 端网页特效 目录 PC 端网页特效 一、 元素偏移量 offset 系列 1、 offset 概述 2、 offset 和 style 区别 二、 元素可视区 client 系列 1、 立即执行函数 2、 pageshow 事件 三、 元素滚动 scroll 系列 1、 元素 scroll 系 阅读全文

posted @ 2022-02-26 18:17 漫思 阅读(78) 评论(0) 推荐(0) 编辑

导航

< 2025年2月 >
26 27 28 29 30 31 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 1
2 3 4 5 6 7 8
点击右上角即可分享
微信分享提示