总结CSS3新特性(Transform篇)

发表于2015-07-21 14:41:54|--次阅读

概述:CSS3新添加的Transform可以改变元素在可视化区域的坐标(这种改变不会引起文档的重排,只有重排),以及形状,还有些3D形变.结合Animation(这里以后会有个链接的) 能实现酷炫的动画;旋转(rotate):rotate支持一个参数,一个角度值 0-360deg#demo { .....

IE系列css opacity属性差异

发表于2015-07-21 14:40:56|--次阅读

透明度width:100%;height:100%; -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)';/*IE8*/ filter:alpha(opacity=50);/*IE4-7*/ position:fixed;...

font-size属性有没有继承性

发表于2015-07-21 14:39:19|--次阅读

font-size属性有没有继承性:这问题自然再简单不过了，不过可能初学者有时对这个问题可能存在疑问，会造成处处为标签内的元素设置字体。这里可以给出一个肯定的答案，font-size数据具有继承性，这样有利于对网页字体进行统一设置。代码实例如下:蚂蚁部落蚂蚁部落太阳出来了由以上代码的...

如何用CSS控制字的间距

发表于2015-07-21 14:37:02|--次阅读

如何用CSS控制字的间距:有时候默认的字间距并不能够满足实际需要，可能需要进行人为的控制，下面就简单介绍一下如何实现此效果。使用letter-spacing属性即可以设置字间距。代码实例如下:蚂蚁部落欢迎来到蚂蚁部落欢迎来到蚂蚁部落欢迎来到蚂蚁部落欢迎来到蚂蚁部落原文地址是:http...

text-align属性有没有继承性

发表于2015-07-20 14:19:56|--次阅读

text-align属性有没有继承性:text-align属性可以将对象内的文本水平居中对齐，应该说不是什么难点，可能有时候会有这样的疑问词属性有没有继承性，如果有的话可以给父元素定义一个居中方式，下面子元素集成就可以了，能够节省些许代码。代码实例如下:蚂蚁部落蚂蚁部落欢迎您以上...

使用CSS3各个属性实现小人的动画

发表于2015-07-20 14:19:49|--次阅读

使用CSS3各个属性实现带有音乐小人的动画，完全不使用JS代码：注：chrome浏览器效果最佳，最终效果静态图：HTML代码如下：练习一个小人的动画 ...

编写SASS的一些技巧

发表于2015-07-20 14:19:35|--次阅读

更好的为变量命名变量是Sass中最简单的特性之一，但有时候也会使用不当。创建站点范围内有语义化的变量，是不可或缺的工作。如果命名不好，他会变得难以理解和重复使用。这里有一些命名变量的小技巧，提供参考：命名变量时不要含糊不清坚持一种命名规则（Modular, BEM等等）确定变量的使用是有道理的这有一...

css3 背景渐变

发表于2015-07-20 09:38:23|--次阅读

在没有了解css也可以做背景渐变以前，我都是通过PS一张背景渐变的图片来应用到自己所做的网页中。然而，在前不久我了解到css3也可以做背景渐变后，想要做背景渐变的效果就很容易了许多，下面是一些css3做背景渐变的方法。一.线性渐变//自上而下的线性渐变div{width:400px;height:1...

CSS3 动画记

发表于2015-07-20 09:38:04|--次阅读

#css3 动画在CSS3中可以通过animation创建复杂的动画序列，像[transition](http://www.cnblogs.com/fxycm/p/4635396.html)属性一样用来控制CSS的属性实现动画效果。 animation实现动画效果主要由两个部分组成。1. ...

css扩展技术：Less和Sass的区别

发表于2015-07-20 09:37:47|--次阅读

这个周学习了Less和Sass这两个css框架，我基本了解了它们各自的语法和特性，并通过两个html网页设计的练习，感受一下它们给我们开发者在进行css网页布局过程中带来的便利。下面是我对它们之间的区别的一些总结。Less和Sass的相同之处：1.变量：可以单独定义一系列通用的样式，在需要的时候进行...

css3 过渡记

发表于2015-07-20 09:37:04|--次阅读

#CSS3 过渡 CSS3的transition允许CSS的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击，获得焦点，被点击或对元素任何改变中触发，并平滑地以动画效果改变CSS的属性值。 transition:[ || || || ] **transition-prope...

CSS3 变形记

发表于2015-07-20 09:36:51|--次阅读

#CSS3 变形 CSS3变形是一些效果的集合，比如平移，旋转，缩放和倾斜效果，每个效果都称为变形函数。##transform transform属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。 transform:none | [] *![](https...

在windows7 上安装 Sublime Text 3 及其插件

发表于2015-07-20 09:36:27|--次阅读

1、下载地址：http://www.sublimetext.com/3请根据你的平台，选择适当的安装版本安装完毕后，设定TAB键为4个空格( Preferences——>Setings-User)：{ "tab_size": 4, "translate_tabs_to_spaces": ...

使用float和display:block将内联元素转换成块元素的不同点

发表于2015-07-17 16:20:34|--次阅读

使用float和display:block将内联元素转换成块元素的不同点:内联元素可以转换成块级元素，常用的方法比如可以为内联元素使用float属性让内联元素浮动起来，或者为内联元素添加display:block。虽然两者都可以让内联元素转换成块级元素，但是有区别的。代码实例如下:蚂蚁部落蚂蚁部落以...

CSS如何实现图片上下垂直居中

发表于2015-07-17 16:20:17|--次阅读

CSS如何实现图片上下垂直居中:在很多时候需要将图片上下垂直居中，不过没有一个直接了当的属性能够实现此功能。当然实现图片上下垂直居中的方法有多重，下面就简单介绍一下其中的两种。方法一:使用margin方式，使图片在div中上下垂直居中。margin-top值的计算方式是:div的高度/2-图片高度/...

id的优先级高还是style的优先级高

发表于2015-07-17 16:20:08|--次阅读

id的优先级高还是style的优先级高:大家都知道id选择器具有较高的优先级，直接写在标签内的style也具有非常高的优先级，大家可能会比较一下两者到底谁的优先级高，下面通过实例来介绍一下谁的优先级更高。代码实例如下:蚂蚁部落蚂蚁部落原文地址是:http://www.51texiao.cn/div_...

如何利用CSS实现各种几何图形形状效果

发表于2015-07-17 16:19:03|--次阅读

如何利用CSS实现各种几何图形形状效果:建议:尽可能的手写代码，可以有效的提高学习效率和深度。大家都知道CSS具有强大的功能，能够让页面变得美观靓丽，随着CSS的版本的提高，功能也越来越强大，下面简单介绍一下如何使用CSS实现各种几何图形效果。一.实现正方形:蚂蚁部落二.实现矩形:蚂蚁部落三.实现圆...

在windows7 上安装 Subline Text 3 及其插件

发表于2015-07-17 15:21:12|--次阅读

1、下载地址：http://www.sublimetext.com/3请根据你的平台，选择适当的安装版本安装完毕后，设定TAB键为4个空格( Preferences——>Setings-User)：{ "tab_size": 4, "translate_tabs_to_spaces": ...

css 盒模型相关样式

发表于2015-07-17 15:21:01|--次阅读

话不多说，一切还是从最基础的说起。盒的类型1.盒的基本类型在css中，用display定义盒的类型，一般分为block类型与inline类型。例如div属于block类型，span属于inline类型我是div 我是span 我也是span 通...

CSS3 - 文字和字体

发表于2015-07-17 15:20:43|--次阅读

1,text-overflow 与 word-wraptext-overflow用来设置是否使用省略标记(...)标示对象内文本的溢出但是text-overflow只是用来说明文字溢出时用什么方式显示，要实现溢出时产生省略号的效果，还须定义强制文本在一行内显示（white-space:nowrap）...