随笔分类 - css相关
摘要:● 重点:运算符前后都需要保留一个空格,例如:width: calc(100% - 10px); ● 任何长度值都可以使用calc()函数进行计算; ● calc()函数支持 "+", "-", "*", "/" 运算; ● calc()函数使用标准的数学运算优先级规则; ● calc()函数支持各
阅读全文
摘要:1、opacity 直接opacity:0.6,表示60%的透明度 2、转换成raba色值 例子:黑色的50%透明度: raba(0,0,0,.5) 3、用fade(比较方便,多用于less中) 例子:要求边框颜色为#0E97EC并且透明度15%,可以用以下写法 border:1px solid f
阅读全文
摘要:发现“~”符号在webkit内核的浏览器中总是偏上,无法实现垂直居中,但是css样式并没啥毛病, 后来发现是字体的原因,把字体定义成Times New Roman,就能垂直居中了。
阅读全文
摘要:用了-webkit-box-flex:1;后,内容多的一边会比较大,若想让其相等,可加上width:1px;
阅读全文
摘要:eg: 当parent鼠标滑过时,childbox出现
阅读全文
摘要:来自开源社区: 在<body>内加入此段代码
阅读全文
摘要:1、在<body>或<html>元素中指定与页面的background-color一样的颜色用来填充整个页面。这样页面的安全区域和其余部分混合在一起。这种方法对于只有图文信息的简单页面已经足够。 但是对于一些有全屏导航或全屏自适应布局的页面,这样设置并不够。需要2、3方法。 2、第一个新特性是对现有
阅读全文
摘要:做移动端页面时经常遇到以下案例,在有背景的页面上写表单,而且底部为了适应不同手机还得运用绝对定位,因为通常是把容器高度设为了100%,这时在安卓手机上弹窗软键盘时就会把背景图片及其他东西挤压上去,解决方法如下: 在css样式中把大容器定义为fixed布局 在js中强制把页面的高度覆给他,就相当于自动
阅读全文
摘要:点中的时候在iphone上测试会像上面那样出现个蒙层,解决方法如下: 只要给页面html加上这样的样式就可以了
阅读全文
摘要:思路:把文字用span包裹起来,设置为inline-block,相当于图片img的属性。父div用table-cell的样式,用vertical-align:middle实习上下居中 使用这方法需要注意的一点是外部div不能使用浮动或者绝对定位。
阅读全文
摘要:list-style-type: decimal;
阅读全文
摘要:做移动端页面时,又想用伪元素做真实1像素边框,又想有边角时,会发现只加一个border-radius时出来的效果边款并没有变成圆角,解决办法是加两个border-radius 图中边框用了真实1px,在pc端看可能不太明显
阅读全文
摘要:text-align-last: right;
阅读全文
摘要:/*超过400px滚动条出现*/max-height:400px; overflow:auto; /*修改滚动条样式*/ .myscroll_wrap::-webkit-scrollbar,.pop .pop_content::-webkit-scrollbar{width:7px;height:7px;} .myscroll_wrap::-webkit-scrollbar,.pop .p...
阅读全文
摘要:text-align-last属性具备auto、start、end、left、right、center和justify几个属性。此属性与text-align属性相比少了match-parent和justify-all。 text-align-last其默认值是auto,而且其只能运用于块元素上,或者
阅读全文
摘要:思路:两个三角形叠加,暂且把有边框的三角形定义为A,大三角形定义为B,小三角形定义为C,B的背景颜色==A的边框颜色,B的背景颜色=A的背景颜色。可以利用伪元素,也可以利用绝对定位的方式。 css样式: 效果图: 定位方式可以根据自己喜欢修改,可以都是绝对定位也可以都是使用伪元素
阅读全文
摘要:以按钮为例,在button上添加以下样式即可消除点击出现的边框
阅读全文