
css
驻风丶
加油加油
展开
-
div中的svg导致div点击事件偶尔失效解决
div中嵌套svg,其中div有一个点击事件点几次就会出现点div不触发事件,而且是点div中svg的部分,下面文字部分依然触发,问题就是svg这。给svg加一个style="pointer-events:none;"这样就不影响父盒子的点击事件了...原创 2021-08-24 14:20:37 · 1199 阅读 · 0 评论 -
css3新特性3d旋转的正方体
效果如图所示,鼠标放上去会向外扩展,小盒子逆时针旋转,大盒子顺时针旋转,有需要的可以改点参数,变成同一方向旋转css<style> *{margin:0;padding:0;} li{list-style:none;} /* 小盒子的旋转动画 */ @keyframes rotateMinBox{ 0%{transform:rotateX(30deg) rotateY(0deg);} 100%{transform:rotateX(30deg) rot原创 2021-02-23 10:48:12 · 290 阅读 · 0 评论 -
js写一个小米首页轮播图
效果如图图片的切换有过渡效果有小圆点和按钮点击切换有鼠标放置停止轮播左边的按钮已经预留了小米官网的左侧列表空间所以css<style> *{margin:0;padding:0;} li{list-style:none;} .box{ width:1226px; height:460px; /* background:red; */ margin:0 auto; position: relative; } .i原创 2021-01-08 19:19:04 · 803 阅读 · 0 评论 -
js写一个气泡屏保能碰撞
大概样式图如下会随机位置生成几个球,颜色也是随机的, 运动方向以及速度也是随机的,不多废话上货!css<style type="text/css"> *{margin:0;padding:0;} div{ width: 50px; height: 50px; background-color: red; border-radius: 50%; position: absolute; }</style>html<div class="bo原创 2021-01-06 20:43:39 · 932 阅读 · 1 评论 -
用js写一个简单的前世今生
前世今生,没有今生只有前世刚开始的样子,没有任何的输入在下面的input内输入自己的名字,然后点击确认就会有前世的一些内容,具体内容都可以自己修改,我只是简单做了一个democss的内容<style> *{margin: 0;padding: 0;} a{text-decoration: none;} li{list-style: none;} .box{ width: 1000px; height: 600px; backg原创 2020-12-23 17:44:59 · 151 阅读 · 0 评论 -
html解决浮动带来的影响
浮动的缺陷浮动会造成标签脱离文档流,使标签塌陷当要进行左右布局时,不能只给右边设置右浮动,必须给左边同时设置左浮动解决浮动的影响1.给浮动的父级标签添加高度2.在被影响的标签添加空白标签,设置clear:both;3.给浮动的父级标签添加::after伪类 ::after{ width:0; height:0; content:''; display:block; overflow:hidden; visibility:hidden; clear:both; }原创 2020-12-11 20:30:48 · 598 阅读 · 0 评论 -
html去除input标签默认边框
input表单点击会出现一个默认边框,设置border: none;或者border: 0;都没有效果,还是会有默认边框,怎么去除呢css设置这个input的outline: none;就可以了原创 2020-12-09 11:28:56 · 6336 阅读 · 0 评论 -
同一行div或者其他行间块状标签,垂直高度不一解决办法
一个textarea和button都设置了display: inline-block;但是两个垂直高度不一致解决办法1.给高度不一的元素添加vertical-align: middle;2.给父级添加display: flex; justify-content: center;原创 2020-12-08 09:42:05 · 598 阅读 · 0 评论 -
两个行间块状div之间的间隙消除
做项目的时候遇到了一个问题,起初一直在比对两行的margin和padding以及他们的宽度,不停的计算,不停的换,还是对不齐,就像下面一样仔细看是没有间隔对齐的,快疯了的时候,发现自己给每个div一共五个,上面两个,下面三个,都设置了display:inline-bolck;为了可以设置大小又不换行,设置为行间块状,结果导致了在margin之外还存在一个间隙。解决办法给父级设置font-size: 0;我是给红色那块设置的,就对齐了。你学废了吗...原创 2020-12-07 15:49:00 · 485 阅读 · 0 评论 -
css块级标签右浮动挤一排解决方法
首先这个问题是这样的一个div里面有四个span标签,都设置了display:block;,现在是这样的右浮动以后给每个span再添加一个clear:right;就可以恢复正常了原创 2020-12-05 10:12:41 · 606 阅读 · 0 评论 -
position的值,relative和absolute分别相对谁定位
absolute:生成绝对定位的元素,定位原点是离自己这一级元素最近的一级position设置为absolute或者relative的父元素的左上角为原点的,若没有此类父元素就往上找直到body。relative:生成相对定位的元素,定位原点是元素本身所在位置。fixed (老IE不支持):生成固定定位的元素,相对于浏览器窗口进行定位。static:默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right z-index 声明)。inherit:规定从父元素继承原创 2020-11-28 17:03:11 · 556 阅读 · 0 评论