css
帅气小军二代
准备成为一名前端工程师
展开
-
css filter drop-shadow的妙用
最近做的项目涉及到展示地图数据的开发,这是同事开发的,他用的是echarts。附上最终效果:我捣鼓了一番,其中令我比较感兴趣的是,地图有点立体的感觉,我们可以看到,地图有微微的突起,可以对比没有突起的,明显立体感就没有这么强了:那么这是怎么实现的呢?起初我以为是echarts的选项,后面我把所有选项都注释了一轮,还是没找到。随后我疯狂百度,找到一篇文章提到用css属性解决,我立马回去搜索,果然,用的是filter的drop-shadow。canvas { filter: drop-shado原创 2021-08-27 13:53:24 · 851 阅读 · 0 评论 -
border-color的默认值
其实这个以前有看到过,不过我给忘了,今天在写边框样式的时候漏了border-color,结果我发现边框颜色的默认值居然和文字的颜色一致,也就是和color的值一致。哈哈,挺有趣的,以后如果有文字颜色和边框颜色一致的需求的时候,直接省略边框颜色即可。...原创 2020-03-12 11:54:56 · 916 阅读 · 0 评论 -
利用flex实现多列等高布局所踩的坑
其实没有标题说的多列啦,就是不同的两列,写的是普通的列表项,左边图片,右边一些文字而已。右边的文字稍稍复杂,分为上中下三行。想要实现的效果:我无意中使用了align-items: center,然后发现右边的文字挤在一起了,用flex-direction: column配合justify-content: space-between无法将他们分开,可以确定的是空间足够,肯定是产生了一些问题...原创 2020-03-07 00:25:52 · 1741 阅读 · 0 评论 -
同一个页面中 100vw与100% 的值不一致
今天在写一个企业官网的时候,由于页面的一个地方要保证宽度占满整个屏幕,且随着屏幕分辨率的改变比例也不改变,所以我想到了用vw单位来写。而页面的其他部分还是传统的宽度100%来写,本来100vw和body的100%应该没什么不同,但是页面却出现了横向滚动条,滚动后发现用了100vw的那个div与其他普通的100%宽度的div格格不入,100vw的比普通的多出了刚好是一个滚动条的宽度,于是我上网搜索...原创 2019-12-19 18:33:39 · 5539 阅读 · 2 评论