UECSS.COM

专注前端开发,关注用户体验,记录成长历程

关于!important

关于!important众所周知,这个规则对Ie6.0,Ie7.0和Firefox能写hack,这里的原理属性我想每个人都很清楚。但在前一段时间一同事用!important这个属性特写了一个样式达到想要的目的,当时我没有明白其中的原理,我问他未果!后来我查了查资料才明白其中的原理.

1、当!important用在两个样式的时候,这时他的作遥原理就是解决各个浏览器之间的兼容问题。

2、当!important单独用在一个样式中,那么它则起保护作用,在任何需要保护的属性后面插入它可以避免被基于特性的属性覆盖。例如:#nav a{color:red;} a{color:yelllow !important},通常,一个带有id名#nav的元素里的一个链接会变为红色,因为这个#nav a比标签 a样式具体的多,但因为包含了!important,以为则会这个属性永远胜出。

其实这里也最主要的关于css优先级,一个标签选择器1分,一个类选择器10分,一个id选择器100,一个行内样式1000,!important就当无限分吧,分值相同时按后出现优先的原则算。

而且这个样式在每个浏览器中都能支持!

今天不谈技术

从上一篇文章到现在应该有一个月的时间了,现在我想感叹一下时间过的很快之外再感叹一下时间过的很快哈另也想感叹一下这一个月的生活,所以今天的主题是不谈技术。

本来我是不想发一些无用的牢骚在blog上面,因为我觉得这样很不应该,但又控制不住那一点点的小激动,所以别闲我烦呐^_^.回想一下这个月的生活其实也蛮丰富多采的,第一周在为辞职的事情和老板一直冷战;第二周在为找工作的事情一直寝食难安;第三周却在新的公司接受像之前同事说的那种封闭式的工作。在这中间离开了一趟上海虽行程不远,但也可以用焦虑不安来形容,然后又参加了拥抱“HTML5”的一个活动,收获不少却很疲惫。好像一直都是处在失望与绝望中!

Continue reading →

关于CSS 旋转

实现这个方法很简单,只要我们利用好css旋转属性就OK了。看一下效果图:

看完效果分析一下:这里有三个嵌套的元素:第一个是最外层不做任何的变化,第二个是第二层元素做顺时针旋转,第三个是最里层元素在同一方向作逆时针旋转。如图:

HTML

<div class="box">
	<div class="inner">
		<div class="content"><img src="img.jpg" alt="my bike" /></div>
	</div>
</div>

The CSS
Continue reading →

30个漂亮有创意的404未找到错误页面

错误页面并不需要难看。 在网站上,任何一个断开的链接将会导致404未找到错误页面。对于这个问题现在 有两种方法可以解决。

选项1:目前,用户使用旧的和默认的错误页面,其中显示没有错误信息的其他。

选项2:第二个解决方案是目前习惯设计一个错误页的页面来解决这个问题或是提示他们可以看一些其他的东西。

你认为哪一种更好呢?显然,第二个选项。

这收集了30个集漂亮和创意的404未找到错误页面:

Continue reading →

[转]前端工程师的尴尬处境

跟大家分享一下:

A: 某小白MM,B: 后端程序员,C: 美工,D: 前端

A: 哎~D,你是做什么的呀?

D: 前端啊。

A: 前端是干什么的?

D: 前端… 前端就是做网站的。

A: 唉?我看网站不是 B 写出来的嘛,也没见你整天写代码呀?

D: 额… 我是做网站外观…

A: 唉?外观不是 C 画出来的吗?也没见你整天开 PS 呀?

D: (汗)我的工作就是把他俩的活儿结合起来…

A: [斜视] 唔,就这么轻松的工作嘛,什么都不用你干。

D: [内牛成河]

css圆角

css3和html5 在大家的眼中已经不是什么新鲜的事了,但是能兼容它的浏览器却不是全部,而我只是简单的看了它们的一些属性,简单的性的了解了一下。前些时间一个同事让我写一个圆角的div,要求是尽量少放图片,我想到了css3中有这个属性
在网上查了查发现写圆角的方法还是有很多的。大概的总结了以下几点:

1.灵活的圆角

为了能让圆角更加灵活,我们可以把容器里的每个圆角都做成一个独立的元素,通过CSS强行定位到父容器的四个角上。在这个方法里,我们只需要用到下边这个图片。

HTML:

Continue reading →