![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css3
weixin_42220130
这个作者很懒,什么都没留下…
展开
-
如何解决浮动元素高度不一导致元素浮动失效
多个浮动元素,高度不一样,结果有的元素被顶下去掉下去了。解决方法:多个浮动元素给一个固定高度即可。暂时还没找到自适浮动应高度的方法。设置所有图片高度106就可以了。审查元素高度大概是106。原创 2023-04-19 22:29:06 · 96 阅读 · 0 评论 -
css line-height属性 150% 1.5
ps:font-size:子级如果没有定义就继承父级的,定义了就用子级的父级:line-height=150%line-height=150%//计算line-height=font-size*150%子级继承父级150%line-height=150%//计算line-height=继承父级计算后的line-height父级 line-height=1.5line-height=1.5//计算line-height=font-size*1.5子级 line-heigh原创 2022-06-14 15:00:38 · 117 阅读 · 0 评论 -
css前端width和height属性
width=元素本身的宽度,不含margin,padding,border,height=元素本身的宽度,不含margin,padding,border,但是如果写了box-sizing: border-box; 还有padding的值,border值的话width=元素宽度+padding-left+padding-right+border-widthheight=元素宽度+padding-top+padding-bottom+border-width...原创 2021-12-14 09:03:00 · 604 阅读 · 0 评论 -
img固定长方形宽高为正方形不变形中心显示
原图使用css width: 150px;height: 150px; object-fit: cover;原创 2021-11-01 17:45:08 · 289 阅读 · 0 评论 -
css 背景颜色怎么铺满整个页面?
给外面盒子一个最小高度为(100vh)整个屏幕.box{background: linear-gradient(90deg,#45b26e,#77c68d); min-height: 100vh;}原创 2021-08-28 11:07:52 · 1269 阅读 · 0 评论 -
CSS绘制三角形—border法
实现一个简单的三角形使用CSS盒模型中的border(边框)即可实现效果图:三角形实现原理:首先来看在为元素添加border时,border的样子<div></div>div { width:50px; height:50px; border: 2px solid orange;}效果图:border一般的用法这是我们平常使用border最普遍的情况——往往只给border一个较小的宽度(通常为1-2px);然而这样的日常用法就会容易让大家对border的形转载 2021-05-31 11:56:24 · 94 阅读 · 0 评论 -
纯CSS写三角形-border法
(1)有边框的三角形我们来写下带边框的三角形。如果是一个正方形,我们写边时,会用到border,但我们这里讨论的三角形本身就是border,不可能再给border添加border属性,所以我们需要用到其他办法。最容易想到的,是叠加层。思路是将两个三角形叠加在一起,外层三角形稍大一些,颜色设置成边框所需的颜色;内层三角形绝对定位在里面。整体就能形成带边框三角形的假象。这里就涉及到一个绝对定位的问题,上、下、左、右四种方向的三角形相对于父级定位是不同的。首先我们来看下,当定位都为0(left:0px;转载 2021-05-20 14:57:43 · 86 阅读 · 0 评论 -
position:fixed固定后禁止底层元素上下滑动
用一个view把代码包起来,当模态层出来时给它添加height:100%;position: absolute;overflow: hidden;模态框消失时去掉样式<view class="box" :class={"fixedHeight:xxx===xxx"}> <view>内容<view> <view>弹窗<view></view><style>.fixedHeight { height:100%;转载 2021-02-19 17:59:17 · 2257 阅读 · 0 评论 -
中间文字两边是水平线怎么写?(利用html和css)
<div class="column"> <p>会场标题</p></div><style>.column{ border-top: solid 1px #000; text-align: center;}.column p{ position: relative; top:-20px background:#fff...原创 2020-03-21 14:08:59 · 617 阅读 · 0 评论 -
左右横线中间文字
效果图片预览代码如下:html:<div class="track-tit"> <h3>中间文字</h3> <span></span></div>css:.track .track-tit { position: relative; line-height: 50px; font-s...转载 2020-02-17 09:59:42 · 315 阅读 · 0 评论 -
style.css
@import "../../../../../fonts.googleapis.com/css-family=Roboto-100,100i,300,300i,400,400i,500,500i,700,700i.css"/*tpa=https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i...原创 2019-12-18 18:48:02 · 629 阅读 · 0 评论 -
CSS鼠标经过图片放大 鼠标离开还原
<!DOCTYPE HTML><html><head> <meta charset="UTF-8"/> <title>fe</title> <style type="text/css"> div img { width: 1860px; ...转载 2019-12-10 21:39:54 · 1422 阅读 · 0 评论 -
css3 渐变 两边透明中间高亮 linear-gradient()
转载请标注原作者:https://www.cnblogs.com/fmixue/p/8309883.html#top<div class="linear"></div>.linear{ width:100%; height:2px; background: linear-gradient( ...转载 2019-07-30 12:02:30 · 8311 阅读 · 0 评论