Css

css 清除浮动的几种方式

1.给浮动的元素的父级添加overflow:hidden;属性ul>不浮动添加overflow:hidden;li>浮动 2.给浮动的元素的父级添加after伪类ul:after{content:"";clear:both;height:0;display:block;overflow:hidde...

CSS3D写3d画廊滚动

CSS样式表*{margin:0;padding:0;}.wrapper{width:800px;height:600px;background:#87CEEB;margin:0auto;position:relative;}ul{position:relative;top:0;bottom:0;right:0;lef...
代码星球·2020-04-04

CSS3动画设置后台登录页背景切换图片

CSS3的动画很实用很好用,简单几句话就可以做出一个好看而且过渡平滑的body背景图片,不多说,来来来,上代码1body{2animation:mybg7s;3-webkit-animation:mybg7s;/*SafariandChrome*/4-moz-animation:mybg7s;/*SafariandCh...

CSS3 3D立方体效果

CSS3系列已经学习了一段时间了,第一篇文章写了一些css3的奇技淫巧,原文戳这里,还获得了较多网友的支持,在此谢过各位,你们的支持是我写文章最大的动力^_^。那么这一篇文章呢,主要是通过一个3D立方体的效果实例来深入了解css3的transform属性,下面是这个实例的截图,加上动画还能旋转起来哟,是不是很酷炫?换上...
代码星球·2020-04-04

CSS3 3D transform变换

 、实际应用-图片的旋转木马效果您可以狠狠地点击这里:图片的旋转木马效果demo建议在足够新版本的FireFox浏览器或Safari浏览器下观看,Chrome可能需要居中定位查看,下图为效果缩略图:原理:那些看上去很酷酷的CSS33D效果其实就颠来倒去那几个属性(本文提到的这几个),折腾来折腾去,这里这个效果...
代码星球·2020-04-04

使用 CSS3 实现超炫的 Loading(加载)动画效果

  Loading动画效果一     HTML代码:1234567<divclass="spinner">  <divclass="rect1"></div>  <di...

CSS自适应布局(左右固定 中间自适应或者右侧固定 左侧自适应)

经常在工作中或者在面试中会碰到这样的问题,比如我想要个布局右侧固定宽度左侧自适应或者三列布局左右固定中间自适应的问题。    下面我们分别来学习下,当然我也是总结下而已,有如以下方法:    一:右侧固定宽度左侧自适应 第一种方法:左侧用m...

CSS框架分析与网站的CSS架构

框架(framework)是一个基本概念上的结构,用于去解决或者处理复杂的问题,是一种可复用的构架。     我们对CSS框架这个词比较陌生,但对于JavaScript框架就比较熟悉了,比如jQuery     但为什么...

css实现固定高度及未知高度文字垂直居中的完美解决方案

在工作当中我们经常碰到类似于"固定高度文字垂直居中及未知高度垂直居中问题",或者"图片垂直居中问题",而我们最容易会想到使用表格来垂直居中,或者如果是单行文字的话使用height(高度)和line-height(行高)来解决,但是假如页面有多行文字的话固定高度该怎么解决?或者未知高度我们该用css怎么解决?且兼容各个游...

CSS的优先级规则

CSS的优先级规则有两类1.位置群组规则最高优先级为元素内嵌的style样式,如<divstyle=”“></div>次高优先级为html头部中的<style>标签里面的样式第三高优先级为通过头部<style>里面@import导入的样式表第四优先...
代码星球·2020-04-04

CSS兼容性(IE和Firefox)技巧大全

CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理技巧并整理了一下。对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE影响CSS处理,作为W3C的标准,一定要加DOCTYPE声明。CSS技巧1.div的垂直居中...

css3.0新属性效果在ie下的解决方案(兼容性)

css3.0增加的新属性,如投影、渐变、旋转、圆角等等!这些新标准属性在ie6、ie7、ie8浏览器版本里得不到很好的支持,相信ie以后的新版本也会支持这些新属性的。目前ie6、ie7、ie8浏览器不支持这些属性并不能说明ie就实现不了css3.0新属性的效果!我们收集整理了一些css3.0新属性效果在ie下的解决方案...

7件你不知道但可以用CSS做的事

7件你不知道但可以用CSS做的事  不管你信不信,CSS和JavaScript开始重叠,就像CSS增加了更多功能一新。在我写“你可能不知道的CSS和JavaScript互相影响的5种方式”一文时,人们对于JavaScript和CSS是如何重叠的感到惊讶。今天,我将重点强调你能用CSS完成的7种工...

这可能是史上最全的CSS自适应布局总结教程

所谓布局,其实包含两个含义:尺寸与定位。也就是说,所有与尺寸和定位相关的属性,都可以用来布局。大体上,布局中会用到的有:尺寸相关的盒子模型,普通流、浮动、绝对定位三种定位机制,CSS3中的transform、弹性盒子模块、试验中的grid模块。逛园子的时候经常可以看到浮动布局,inline-block布局,弹性盒布局这...

总结css兼容问题

目前主流浏览器的兼容性做的都比较好了,本文主要针对IE6,7的不兼容问题进行解决。1.有浮动存在时,计算一定要精确,不要让内容的宽高超出我们所设置的宽高,IE6下,内容会撑开设置好的高度。  解决方法:给对应的父级加overflow:hidden;但是会有部分被隐藏掉,最好是精确计算宽高再设定eg:(ie会撑开)[co...
代码星球·2020-04-04