关闭

深入理解CSS3 Animation 帧动画 steps

CSS3我在5年之前就有用了,包括公司项目都一直在很前沿的技术。 最近在写慕课网的七夕主题,用了大量的CSS3动画,但是真的沉淀下来仔细的去深入CSS3动画的各个属性发现还是很深的,这里就写下关于帧动画steps属性的理解 我们知道CSS3的Animation有八个属性 animation-nameanimation-durationanimation-delayanimatio...
阅读(367) 评论(0)

clearfix清除浮动闭合容器之:after与:before

首先对伪类:before与:after做下注脚 :before 伪元素在元素之前添加内容。 :after 伪元素在元素之后添加内容。 这2个伪元素允许创作人员在元素内容的 最前面/最后面 插入生成内容。默认地,这个伪元素是行内元素,不过可以使用属性 display 改变这一点。该二伪类不被IE6/7所支持。 好了,进入正题 在平常我们coding时候经常会发生子元素浮...
阅读(901) 评论(0)

外层DIV 包含内层DIV 样式问题

.clearfix { display: block; float: none; clear: both; overflow: hidden; width: auto; height: 0; margin: 0 auto; padding: 0; font-size: 0; line-height: 0; dasdsadsad dsadsa 关键...
阅读(3338) 评论(0)

固定宽度的DIV中英文不能自动换行

很久前的一个问题,当时直接就overflow:hidden了,还说出:这个问题只能这样解决不了的了,我懒惰..... 病症(其实不应该说病症):     在一个设定好宽度的div中,当我们输入的中文文字长度超过了设定宽度时,会自动换到下一行。但是,如果输入的是英文字母,那么,无论你div设定宽度为多少,英文字母都是不换行直接在同一行输出,导致div的宽度远远超出设定的大小。 原因: ...
阅读(825) 评论(0)

inline、block、inline-block的区别

我们用firbug浏览别人网站时会发现设计者会在很多地方使用inline-block。我们都知道inline是声明div是内联对象,block是声明块对象,那么inline-block是什么意思,即内联又成块?接下来做个测试,让我们了解一下三者的区别和作用吧: 1 2 3 4 5 6 7 8 9 10 11 ...
阅读(824) 评论(0)

关于CSS中的float和position

原文 http://learn.shayhowe.com/advanced-html-css/detailed-css-positioning 当构建页面排版时,有不同的方法可以使用。使用哪一种方法取决于具体页面的排版要求,在不同的情况下,某些方法可能好过于其他的方法。 比如,可以使用若干个浮动元素来构建一个整洁简洁的页面排版。或者,如果需要更复杂的排版要求,可以考略使用其他方法,...
阅读(625) 评论(0)

float 浮动 div 不随浏览器分辨率 大小而位置发生变化

dsadsadsa 111111111111111111 在浮动层外部 增加 父DIV 设定宽度jik...
阅读(5830) 评论(0)

css text-overflow 超过宽度显示省略号

使用text-overflow:ellipsis对溢出文本显示省略号有两个好处,一是不用通过程序限定字数;二是有利于SEO。需要使用对对溢出文本显示省略号的通常是文章标题列表,这样处理对搜索引擎更友好,因为标题实际上并未被截字,而是局限于宽度而未被显示而已。 通常的做法是这样的: 1.overflow:hidden; 2.text-overflow:ellipsis; 3.-o-text-ove...
阅读(612) 评论(0)

图片、多行文字的水平垂直居中

本文综述 想必写css的都知道如何让单行文字在高度固定的容器内垂直居中,但是您知道或者想过让行数不固定的文字在高度固定的容器内垂直居中呢?本文将会告诉你如何实现多行文字的垂直居中显示。 关于图片垂直居中显示,想必很多写css的人都研究过,或者说是搜寻过方法。淘宝团队似乎提供了一种不错的方法,用font-size解决IE下垂直居中的问题,是个好方法吗?是的,方法是不错,可是问题也很多:不支持im...
阅读(1407) 评论(0)

CSS 实现图片灰度效果 兼容各种浏览器

CSS实现图片灰度效果就是通过CSS样式让彩色图片呈现为灰色,相当于把一张图像的颜色模式调整为灰度,CSS可以通过以下几种方法来实现灰度效果。 方式1. IE滤镜 img { filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); } //标准写法 img { filter:Gray; } //简写 ...
阅读(3073) 评论(0)

css line-height记录

使用line-height 后 文字就会从line-height中间像素开始显示。这样就可以用于文字垂直居中了。   例如 height:40px,line-height:40px,那么文件就会居中了;这里文字就会垂直从 20px开始显示...
阅读(532) 评论(0)

如何给自己的网站添加小图标

网站小图标就像LOGO一样可以为你的网站增色不少!这个小图标是显示在浏览器地址栏以及收藏夹里,现在无论是从制作、上传到最后的显示都十分简单。但是,可能还有一些网友不知道这个究竟是怎么搞出来的!尤其对于wordpress网站,似乎通用的做法并不能让这个美丽的小图标“显身”! 先来简单地了解一下这个小图标吧。其实,它就是我们常见的favicon.ico。favicon就是英文favourit...
阅读(5449) 评论(0)

CSS :after 伪元素

CSS :after 伪元素定义和用法 :after 伪元素在元素之后添加内容。 这个伪元素允许创作人员在元素内容的最后面插入生成内容。默认地,这个伪元素是行内元素, 不过可以使用属性 display 改变这一点。 实例 此样式会在每个 h1 元素之后播放一段声音: h1:after { content:url(beep.wav); }  h1:after {cont...
阅读(827) 评论(0)

解决内部容器float浮动后不能撑开外部容器及CSS伪类:after的使用

解决内部容器float浮动后不能撑开外部容器,外部容器塌陷问题 方法一: 直接在内部添加一个空的容器可以撑开外部容器。 方法二: .clearfix:after {     content:".";     display:block;     height:0;     clear:both;     visibility:hidden; } *html ....
阅读(1137) 评论(0)

CSS中不为人知Zoom属性的使用介绍(IE私有属性)

其实Zoom属性是IE浏览器的专有属性,Firefox等浏览器不支持。它可以设置或检索对象的缩放比例。除此之外,它还有其他一些小作用,比如触发ie的hasLayout属性,清除浮动、清除margin的重叠等。  Zoom的使用方法:  zoom : normal | number  normal :  默认值。使用对象的实际尺寸  number :  百分数 | 无符号浮...
阅读(967) 评论(0)
27条 共2页1 2 下一页 尾页
    个人资料
    • 访问:7804964次
    • 积分:67022
    • 等级:
    • 排名:第28名
    • 原创:254篇
    • 转载:2716篇
    • 译文:3篇
    • 评论:714条
    文章分类
    最新评论