随笔分类 -  css

摘要:前言 在项目中有一个需求,做一个流程图,本来想着ctrl+c/v来着方便些,网上查了一下,少之又少,就干脆自己写了一下,供大家参考。示例图如下。 本次开发用的是vue+scss形式,不过基本上都是css3+js而已,简单易懂,同样也好拓展。 图例 思路 父元素设置flex布局,子元素都是自适应,可随 阅读全文
posted @ 2021-11-02 22:17 热爱前端的17号诶 阅读(1600) 评论(1) 推荐(1)
摘要:一 scroll系列属性 ——滚动 1 scrollHeight/scrollWidth 标签内部实际内容的高度/宽度 ele.scrollHeight 有两种情况, 当内容超出盒子范围后,返回的是内容的高度,包括padding,从顶部内侧到内容的最外部分。 当内容不超出盒子范围时,返回的是盒子的高 阅读全文
posted @ 2019-01-03 21:50 热爱前端的17号诶 阅读(346) 评论(0) 推荐(0)
摘要:一 前提摘要 有一个活就是按照需求在现有的项目中新增几个项目和修改几个项目,是很简单的,但当中遇到了一个小问题,就是tabs中图标选中和被选中的颜色问题,如果是新开发的,目前掌握的有两种办法,比如准备两个类型一样颜色不一样的图片,选中时图片隐藏和显示。另一种就是字体图标,在iconfont找到相应的 阅读全文
posted @ 2018-12-29 13:54 热爱前端的17号诶 阅读(2181) 评论(0) 推荐(0)
摘要:前言: 在项目开发中,遇到了一个需求,实现一行上的导航栏过多使其产生横向滚动条。一开始做项目,给的时间太短又着急,觉得网上有现成的,去搜发现没有,只好自己去写,一开始用的是平常css+js实现功能,之后学习了flex布局,所以又想到了用flex实现横向滚动条。两种方法,记录下来,供以后借鉴。 正文: 阅读全文
posted @ 2018-07-02 10:02 热爱前端的17号诶 阅读(26601) 评论(0) 推荐(2)
摘要:引言: 网页布局在flex出来之前,是由盒模型为底子,float,position,table,百分比来进行布局的,重绘的比较多,影响性能,复杂又不好维护。flex布局,可以简便、完整、响应式地实现各种页面布局。我在网上看到有很多写flex布局的博文,自己就写着复习一下这个flex布局。 一 基本概 阅读全文
posted @ 2018-06-29 09:53 热爱前端的17号诶 阅读(1004) 评论(0) 推荐(3)
摘要:有的在开发中,遇到传来的数据太长,渲染到页面上会超出可视页面,出现横向滚动条,想解决一个办法就是数据到一定程度换行。 阅读全文
posted @ 2018-01-05 15:11 热爱前端的17号诶 阅读(397) 评论(0) 推荐(0)
摘要:不可拉伸: 不可编辑: 第一种方法: 第二种方法: 阅读全文
posted @ 2018-01-03 15:40 热爱前端的17号诶 阅读(6662) 评论(0) 推荐(1)
摘要:项目开发中,在浏览同事的代码,发现他经常用一个属性--box-sizing,很好奇是什么,于是乎,上网查阅资料学了起来。 首先我们先复习一下盒模型的组成:一个div通常由 content(内容)+margin+padding+border组成。 浏览器有两种盒模型:w3c说的标准模型和ie下的传统模 阅读全文
posted @ 2017-12-19 17:24 热爱前端的17号诶 阅读(1077) 评论(0) 推荐(1)
摘要:最近这个月一直在赶项目开发,遇到的问题和学到的前端知识没有更新到博客园,现在闲了下来,就整理一下前端知识。 在项目开发中,在样式这方面花费的时间较多,因为针对于数字的变化特别多,本人不爱记数字,在看设计图时总是反复计算之间的数值,觉得很麻烦,偶然谷歌一下,发现了css3的一个属性--calc() c 阅读全文
posted @ 2017-12-16 15:00 热爱前端的17号诶 阅读(1247) 评论(0) 推荐(1)
摘要:在前端项目开发中,px,em,以及rem都是页面布局常用的单位,虽然它们是长度单位,但是所含的意义不一样。通过复习和查阅,总结了以下知识。 px像素(Pixel) 定义:相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册) 特点: 1:px代表的是像素,用它设置字体大小时, 阅读全文
posted @ 2017-08-13 18:42 热爱前端的17号诶 阅读(1837) 评论(0) 推荐(1)