css
maybe28
脑子不好使的假程序员……
展开
-
css实现聊天气泡以及形状--边框法
实现以下的效果可以利用css的border属性:首先:我们给一个元素四周都加上边框的话,.box{width:10px;height:10px;border:10pxsolid;border-color:#f00 #0f0 #00f#0ff;}形状为:因此:生成一个三角形的css就可以写成为:.box{width:翻译 2017-08-03 14:53:07 · 1949 阅读 · 0 评论 -
table-cell
table-cell属性是让标签元素以表格单元格的形式呈现,类似于td标签,table-cell会被其他一些css属性破坏,比如float,position:absolute,所以这些属性尽量不同用。设置了table-cell属性的元素对宽度高度比较敏感,对margin值没有反应,相应padding属性。1.table-cell实现等高布局如图所示:三个div里的内容是不相同的,但是容器的高度是根...翻译 2018-02-23 18:41:28 · 3132 阅读 · 0 评论 -
filter---的各种值
之前只用过filter的opacity,竟然不知道filter还有很多的值,可以在我们的项目中设置使用。下面将会使用图片➕属性值的方式介绍filter。1.none。。默认值,没有效果。2.blur。。给图像设置高斯模糊。"radius"一值设定高斯函数的标准差,或者是屏幕上以多少像素融在一起, 所以值越大越模糊;---filter:blur(10px);3.brightness(%)。。给图片应...原创 2018-05-03 21:01:47 · 324 阅读 · 0 评论 -
小标题自适应的经典布局--flex
实现如图所以的小标题布局。实现的注意点:1.两边的线是自适应的,不能写死。如果屏幕大,则留白超级大。否则,线可能就挨着边了。2.因为后面的北京是图片,所以不能用一个div盖在线上。我的实现的方法:<div class="title"> <div class="line"></div> <div class="text">优惠信息&原创 2018-05-04 18:48:33 · 483 阅读 · 0 评论 -
使用css实现一个正方形
很多情况下,在移动端的设计里,会出现要求图片等高等宽,而图片的宽度又是随着不同的移动设备进行改变的,这个时候就需要用到正方形的一个实现。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style原创 2018-07-02 20:34:40 · 11346 阅读 · 2 评论