css
蝼蚁筑巢
你所浪费的今天,是昨天死去的人奢望的明天。你所厌恶的现在,是未来的你回不去的曾经
展开
-
不一样的图片垂直居中
直入主题,看码。。div{width:500px;height:600px;}#img1{width:0;height:600px;}#img11{vertical-align: middle;} 简单吧,只要在容器放一张图片设置高度和容器高度一样,然后在需要居中的图片设置样式vertical-align;大功告成。在文本里同样起作用,如,想要这原创 2015-03-30 16:06:20 · 281 阅读 · 0 评论 -
css3兼容IE8的方案 各个ie的hack
虽然现在很多项目已经对低版本IE不要求了,但是还有部分公司对IE8还是很执着的,咱作为屌丝前端程序员不能和老板说前端潮流,不能说趋势,只能动脑子了,下面就分享一些css3兼容ie8的方案思路。主要是实现弯道超车。比如css3的nth-child选择器,它有多好用就不解析了,问题它不兼容ie8,怎么破呢?1.用jq选择器实现弯道超车,比如我想选择前面五个li,可以这样选。$("li:nth-翻译 2016-03-03 10:05:23 · 11491 阅读 · 0 评论 -
css 盒子水平居中(确定宽度和不确定宽度)
说到让一个div水平居中,立马想到最常用的就是margin:0 auto;但是这个的前提是必须知道盒子的宽度,盒子居中主要有两种情况:一.确定盒子的宽度,解决办法有:1.1 margin:0 auto;1.2 position:relative;left:50%;margin-left:-0.5*width;(用绝对定位也可以)二.不确定盒子宽度的,而且盒子宽度可变的,方法如下原创 2016-04-13 10:19:40 · 9324 阅读 · 0 评论 -
子盒子水平垂直居中的小技巧
1.这种方法只适合在父盒子只有一个子盒子的时候使用代码如下:style> .content{ position: relative; width:300px; height:300px; margin:0 auto; background-color: orange; } .box{原创 2016-09-12 15:16:42 · 2684 阅读 · 0 评论 -
margin的折叠与计算以及解决之道
今天就来捋一捋简单低调却奢华的css,主要鲁三个点:一.margin的折叠二.margin折叠后的计算三.margin折叠的解决之道先来捋一捋margin的折叠:主要分为父子折叠以及兄弟折叠,都是垂直方向上的折叠父子折叠(不一定是父子,可以是多层级的包含,只要是空盒子嵌套)看例子:我们的目的是想让li和ul之间有个10原创 2016-09-01 11:24:32 · 3024 阅读 · 0 评论 -
css 布局小技巧 左边固定右边自适应
在页面布局或者是列表布局中,我们经常出现一个场景:左边是固定宽度的盒子,右边自适应:div class="product_open"> label class="label">Open Product:label>//这一列是固定宽度 ul class="check_game">//这一列自适应 li>label>input type="checkbox">原创 2016-09-13 19:15:33 · 4631 阅读 · 0 评论 -
头尾固定高度中间自适应高度
这是关于常用的css布局技巧:需求:头部和尾部高度固定,中间高度自适应ps:我这里不贴代码,只是讲技术点和思路,毕竟我这个不是教程,我只是希望用我的一点点时间写一些博客,可以给那些刚入门的前端同学一点点帮助。1.兼容低版本ie的写法head: 头部设置固定高度,例如高度100pxcontent:设置绝对定位,top:100px; bottom:100px; left:0,right:0;ove...原创 2018-03-28 10:47:19 · 1035 阅读 · 0 评论