css3
csdncsdn9876
这个作者很懒,什么都没留下…
展开
-
一副图搞定盒子的所有争议
下面的这幅图片可以完好的解决大家对盒子模型的争议!原创 2016-06-02 15:42:19 · 263 阅读 · 0 评论 -
css3中弹性盒子模型
原创 2016-06-16 17:05:17 · 284 阅读 · 0 评论 -
css3中的多列布局!也就是传说中的瀑布流布局
其实看标题觉得很牛逼。真的也没什么牛逼的了。也就是一个多列布局而已。上涨图 这里面最主要的属性就是column-count。只要在一个盒子中设置了column-count(n)列数之后,浏览器会自动将你的内容在盒子中以最佳的方式排布。就是这么简单的一回事。没什么好觉得难的。原创 2016-06-16 16:45:07 · 294 阅读 · 0 评论 -
css3中的animation动画
首先上一张图 上图对animation所对应的参数都写的很清楚了!我们只需要自己定义一个动画名字,然后给animation-name调用就可以了! @ keyframs 动画名{ 0%{width:30px} 20%{width : 100px} ...... 100%{width : 300px} }原创 2016-06-16 16:34:45 · 331 阅读 · 0 评论 -
css3过渡总结
这里的总结是对css3动画中的三大内容中的transition进行总结! 首先css3中动画的三大部分是 transform 变形 transition过渡 animation动画 transition:属性 持续时间 过渡方法 延迟时间(可选)原创 2016-06-16 16:17:41 · 282 阅读 · 0 评论 -
css3变形
transform:translateX();水平方向上平移 transform : translateY();竖直方向上平移 transform:translate(x,y);l两个方向同时平移 transform:scaleX();水平放大或者缩小 transform:scaleY();竖直方向上放大或者缩小 transform:scale(x,y);两个方向同时放大或者缩小原创 2016-06-16 15:19:25 · 223 阅读 · 0 评论 -
css3背景属性总结
background-size:背景大小 cover:将图片铺满整个盒子; container:将图片放到紧贴盒子的一边; background-origin:背景位置 border-box padding-box centent-box 意思很明白就是从什么位置开始平铺 配合使用:background-position:left/top/right...原创 2016-06-16 12:24:35 · 229 阅读 · 0 评论 -
css3边框总结
border-radiius 用来制作圆角 border-colors 制作多色边框,用的比较少。 border-image:边框背景 参数:url() size repeat border-shadow:边框阴影。参数 x y blur spread color inset原创 2016-06-16 12:03:18 · 256 阅读 · 0 评论 -
css3颜色
opacity 取值是0-1;可以用来改变的元素的透明度! rgba 取值是0-1 rgba也就是比rgb多了一个alpha滤镜效果。 rgba与rgb相比,不会改变文本的透明度,只会改变背景的透明度。 linear-gradient(),线性渐变。 用法:background:linear-gradient(to right,color1,color2,col原创 2016-06-16 11:23:07 · 400 阅读 · 0 评论 -
css3文本属性
text-shadow 用来是文本产生阴影!text-shadow:x y blur color; text-stroke 用来给文字加边框的!text-stroke:size color; text-overflow 用来处理文本溢出的。text-overflow:ellipsis或者clip 其中ellipsis是让溢出的文本以...显示;clip是直接裁掉多余的文本。不显原创 2016-06-16 10:54:14 · 262 阅读 · 0 评论 -
css3第二课时!css3新增属性选择器!
css3属性选择器,说的通俗一点就是根据元素的属性来选取元素!在css3中新增的属性选择器,如下表所示: 通过上面的表格我们可以看到,对于某个元素的属性,我们可以通过^=来判断该属性是不是以某个字符串开头;通过$=来判断该属性是不是以某个字符床结尾;通过*=来判断是不是包含某个字符串。满足条件的元素,将会被选中。<!DOCTYPE html> <html> <head> <meta原创 2016-06-15 22:36:38 · 256 阅读 · 0 评论 -
css3第一课时!
选择器 文本效果 颜色效果 边框效果 背景效果 css3变形 css3过渡 css3动画 多列布局 弹性盒子模型 用户界面 关于解决浏览器兼容问题的属性私有前缀!如下表所示: 也就是说,当你使用某个css3属性的时候,问了考虑浏览器的兼容问题,你需要在该属性前面加上表格对应的私有前缀。原创 2016-06-15 22:10:04 · 230 阅读 · 0 评论 -
自己制作调节阴影的CSS3小部件!
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>border-image</title> <script src="../js/jquery.min.js"></script> </head> <style media="screen"> .div1{ width: 2原创 2016-06-14 22:50:37 · 233 阅读 · 0 评论 -
web前端笔试
1. 请用div+css写出文字水平垂直居中,图片水平垂直居中的样式及布局。 2. 请用div+css写出左侧固定(width:200px),右侧自适应的页面布局。 3. 请写出至少五种css浏览器兼容性的写法。 4. jquery的绑定事件有几种方式 ,请举例说明其优缺点。 5. 请写出至少三种js浏览器兼容性的写法。原创 2016-06-20 19:03:24 · 259 阅读 · 0 评论