css3
左又
虽然走得慢,但是总会到达终点;
展开
-
css美化滚动条hover显示
.story-scroll{ height: 298px; overflow: auto; position: relative; &::-webkit-scrollbar { width: 8px; background-color: none; } &:hover ::-webkit-scrollbar-track-piece { background-color: #eee; .原创 2022-04-28 16:04:17 · 1451 阅读 · 0 评论 -
密码框自动填充浏览器保存密码解决
autocomplete="new-password"在input 加上这个设置,但是这个方法只能解决不自动填充的问题,输入框点击输入时文本框底部会出现对应浏览器缓存密码;原创 2020-12-09 16:40:50 · 540 阅读 · 0 评论 -
px、em、rem、%、vw、vh、vm这些单位的区别
1.背景介绍我们为什么要选择合适的网页设计单位随着Web的发展,对新的解决方案的需求也会继续增大,对网页的要求更高。网页设计单位是涉及到我们布局的效果,使用不同的单位会对最终的demo,会有影响。现在都是要求响应式设计,需要适配各种设备,电脑,手机,平板。如果单位不合适,可能在这个设备显示良好,那个设备就会打乱布局。所以需要我们选择合适的单位来进行开发,设计。2.知识剖析1、pxpx就是pixel的缩写,意为像素。px就是设备或者图片最小的一个点,比如常常听到的电脑像素是1024x768的,转载 2020-10-29 10:35:52 · 298 阅读 · 0 评论 -
小程序跑马灯首尾无缝链接
看了很多的跑马灯都写的不太符合要求,这个跑马灯的需求是初始化从屏幕的1/2处开始,结束后第二次与上一次间隔屏幕一半的宽度,从屏幕右侧开始滑动,本文只做到初始化从屏幕的初始化从屏幕的1/2处开始,结束后第二次与上一次间隔屏幕一半的宽度,从屏幕右侧开始滑动,第三次还是从屏幕的1/2处,这个不知道怎么解决;跪求评论1.html<!-- css3跑马灯 --> <view style="position: relative;height:50rpx;">原创 2020-10-22 17:25:46 · 878 阅读 · 0 评论 -
CSS 变量教程
2017年三月,微软宣布Edge 浏览器将支持 CSS 变量。这个重要的 CSS 新功能,所有主要浏览器已经都支持了。本文全面介绍如何使用它,你会发现原生 CSS 从此变得异常强大。一、变量的声明声明变量的时候,变量名前面要加两根连词线(--)。body { --foo: #7F583F; --bar: #F7EFD2;}上面代码中,body选择器里面声明了两个变量:--foo和--bar。它们与color、font-size等正式属性没有什么不同,只是没有默认.转载 2020-05-29 17:50:20 · 201 阅读 · 0 评论 -
css3动画集合
1.div由短变长.red_banner_line{ width: 20px;height: 4px;background: #EA0000;float: right; transition:width .5s;float: right; -moz-transition:width .5s; /* Firefox 4 */ -webkit-transition:width .5s...原创 2019-05-25 15:20:32 · 159 阅读 · 0 评论 -
icon css3伪类实现
1、关闭按钮.close { width: 30px; height: 30px; /*方便相对于父元素进行定位*/ position: absolute; top: 10px; right: 10px; //border: 1px solid greenyellow; ...原创 2019-07-15 16:12:01 · 221 阅读 · 0 评论 -
弹性布局flex平分一行、换行平分以及flex布局宽度自定义
<div class="nav"> <div class="nav-li">成就</div> <div class="nav-li">动态</div> <div class="nav-li">收藏</div></div>Css: .nav{ display:...原创 2019-07-01 10:24:55 · 11273 阅读 · 0 评论 -
三角形里面包裹一个勾css
如图:.div { position: absolute; height: 40px; line-height: 40px; padding: 0 20px; border: 1px solid red; box-sizing: border-box;}.active:after { content: ""; p...原创 2019-08-16 14:27:30 · 1164 阅读 · 0 评论