最近仔细研究了一下关于css 背景图片的定位问题，也许有的朋友会认为这是个简单的问题，以至于在网上很难搜到关于background-position的详细解释，能搜到的帖子基本上都是千篇一律的把概念复制一下贴出来的。
不过在这里我还是先要把概念再罗嗦一遍(不想看的朋友可以直接跳过这个部分)
语法：
background-position : length || length
background-position : position || position
取值：
length ...
1.
a：通常ie5/win中字的现实结果总是要比其他浏览器整整大一号，为了让所有浏览器兼容，我们需要利用CSS hack。
body{
font-size:x-small;/* for IE5/Win */
voice-family:"\"}\"";
voice-family:inherit;
font-size:small;/for compliant browsers */
}
html>body{/* be nice to Opera */
...
http://webmaster.javaeye.com/blog/188415
昨天晚上我做了一个版本，时间仓促，自己都觉得很一般，有好建议大家帮忙提哦，然后我抽时间再做一个版本
用条件注释让你指定把样式应用给哪个IE版本，如
<!-- [if Ite IE 6] >
<link href="IE_styles.css" rel="stylesheet" type="text/css" />
<!-- [endif] -->
或者，利用@import方法：
<!-- [if Ite IE 6]>
<style type="text/css">
@import url(IE_styles.css)
</style>
<! [endif] -->
这个Ite代表“less than or equal to (小于或等于)”，因此if ...
最近正在看《CSS实战手册》这本书，发现第五章管理多种样式中的样式优先级公式挺实用的。 有时候我们给同样一个属性用多种方式去定义样式，来自最具体的样式的属性会胜出，但不知道到底哪种样式最具体，好在css还提供了一个公式，他根据指派给样式选择器的值决定样式的特性——标签选择器、类选择器、ID选择器，等等。这个系统是这样进行的： 1.一个标签选择器值1分。 2.一个类选择器值10。 3.一个ID选择器值100分。 4.一个行内样式 ...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>三角形的写法</title>
<meta http-equiv="Content-Type&qu ...
1. !important随着IE7对!important的支持,现在IE7和FF都支持!important，可以用!important来区分FF、IE7和IE6的高度。用法如下：<style rel="stylesheet" type="text/css">
<!--
.content{background:#a5a5a5;height:100px !important;}/* Moz+IE7 */
.content{background:#a5a5a5;height:200px;}/* IE6 */
-->
< ...
10个你未必知道的CSS技巧
class和id，有意思的文章
CSS的十八般技巧
CSS--浏览器条件注释理论及实践
探索CSS实现三行三列等高布局
用css制作表单并体验亲和力
最窄770px最宽1024px经典布局
div+css布局漫谈
兼容标准XHTML的浮动层特效实现
使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则如下：
颜色
16进制的色彩值，如果每两位的值相同，可以缩写一半，例如：
#000000可以缩写为#000;#336699可以缩写为#369;
盒尺寸
通常有下面四种书写方法:
property:value1; 表示所有边都是一个值value1；
property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2
property:value1 value2 value3; 表示top的值是value1，right和left的值是value2，bo ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style>
<!--
.box{
width:20em;
background:#ffffff url(http://ice-cream.javaeye.com/upload/picture/pic/8113/5db63aa3-4742-3124-9347-5b2 ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style>
<!--
.line{
background:#000;
width:500px;
height:1px;
font-size:0;
overflow:hidden;
}
-->
</style>
</HEAD> ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><style><!--.tooltip{position:relative;}.tooltip span{display:none;width:180px;}.tooltip:hover span{position:absolute;display:block;top:16px;left:32p ...
链接有两种，一种是不同页面间的链接，这种最常见。另外一种则是页内链接，我们一般称为页内锚链接。
1.加锚链
定义好“锚”以后，将链接指向锚位置的链接形式如下:
<a href=″＃id″>....</a>,即以＃再加上id格式。
如:
<a href=″＃chapter1″>第一章</a>
<a href=″＃chapter2″>第二章</a>
<a href=″＃chapter3″>第三章</a>
..............
<div id=″chapter1″>
...第一章内容..
</ ...
em指字体高，任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px= 0.625em。为了简化font -size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。
em有如下特点：
1. em的值并不是固定的；
2. em会继承父级元素的字体大小。
word-wrap : normal | break-word
normal : 默认值。允许内容顶开指定的容器边界
break-word : 内容将在边界内换行。如果需要，词内换行( word-break )也将发生
word-break : normal | break-all | keep-all
normal : 默认值。允许在词间换行
break-all : 该行为与亚洲语言的 normal 相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 与所有非亚洲语言的 normal 相同。对于中文，韩 ...
当type="file"时，input框右侧的browse按钮可以换成图片:<style>
div {width:350px;position:relative;}
.file {position:absolute;top:0px;right:350px;+top:0;+right:45px;width:0px;height:25px;float:left; filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}
.txt {width:200px;height:25px;margin-right:5px;fl ...
ice-cream
- 浏览: 12011 次
- 性别:
- 来自: 上海
- 详细资料
搜索本博客
我的相册
共 107 张
最近加入圈子
链接
最新评论
-
《css实战手册》读书笔记 ...
帮助新手理解而已，熟练了还是别这么记。
-- by rj045wq -
javaScript DOM特性/方法
看在是O+的份上.....
-- by sai619 -
jQuery插件
从Ext转向jQuery了，发现要自己写css真是一件“自虐”的事
-- by wangxin0072000 -
javaScript DOM特性/方法
这些概念都在Professional JavaScript for Web De ...
-- by softwin -
javaScript DOM特性/方法
w3school在线的手册也很全
-- by playfish
评论排行榜