CSS tips and tricks

一.使用css缩写

使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。

二.明确定义单位,除非值为0

忘记定义尺寸的单位是CSS新手普遍的错误。在HTML中你可以只写width=”100″,但是在CSS中,你必须给一 个准确的单位,比如:width:100px width:100em。只有两个例外情况可以不定义单位:行高和0值。除此以 外,其他值都必须紧跟单位,不要在数值和单位之间加空格。

三.区分大小写

当在XHTML中使用CSS,CSS里定义的元素名称是区分大小写的。为了避免这种错误,我建议所有的定义名称 都采用小写

class和id的值在HTML和XHTML中也是区分大小写的,如果你一定要大小写混合写,请仔细确认你在CSS的定 义和XHTML里的标签是一致的。

四.取消class和id前的元素限定

当你写给一个元素定义class或者id,你可以省略前面的元素限定,因为ID在一个页面里是唯一的,而clas s可以在页面中多次使用。你限定某个元素毫无意义。例如:

div#content { /* declarations */ }

fieldset.details { /* declarations */ }

可以写成

#content { /* declarations */ }

.details { /* declarations */ }

这样可以节省一些字节。

五.默认值

通常padding的默认值为0,background-color的默认值是transparent。但是在不同的浏览器默认值可能不 同。如果怕有冲突,可以在样式表一开始就先定义所有元素的margin和padding值都为0,象这样:

* {
margin:0;

padding:0;

}

› Continue reading

Tags: , , , ,

星期三, 四月 28th, 2010 Web 没有评论

CSS的语法缩写总结

一 颜色

16进制的色彩值,如果每两位的值相同,可以缩写一半

#000000 = #000;

#336699 = #369;

二 盒尺寸

一个值时上下左右的尺寸一样:(top,right,bottmo,left)

margin:1em;

padding:1em;

两个值时是上下取第一个值,左右取第二个值:(top,bottom)–>(left,right)

margin:1em 0;

三个值时是上,左右,下 top–>(left,right)->bottom

margin:1em 0 2em;

四个值时模型尺寸赋值是顺时针的,也就是top–>right–>bottom–>left;

margin:1em 0 2em 0.5em;

三 边框(border)

border-width:1px;

border-style:solid;

border-color:#000;

可以缩写成

border:1px solid #000;

语法是: border:width style color;

四 背景(Backgrounds)

background-color:#f00;
background-image:url(background.gif);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:0 0;

可以缩写成

background:#f00 url(background.gif) no-repeat fixed 0 0;

语法是: background:color image repeat attachment position;

可以省略其中一个或多个属性值,如果省略,该属性值将用浏览器默认值,默认值为

color: transparent
image: none
repeat: repeat
attachment: scroll
position: 0% 0%

字体(fonts)

字体的属性如下:

font-style:italic;
font-variant:small-caps;
font-weight:bold;
font-size:1em;
line-height:140%;
font-family:"Lucida Grande",sans-serif;

可以缩写为一句:

font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;

注意,如果你缩写字体定义,至少要定义font-sizefont-family两个值。

列表(lists)

取消默认的圆点和序号可以这样写

list-style:none;,

list的属性如下:

list-style-type:square;
list-style-position:inside;
list-style-image:url(image.gif);

可以缩写为一句:

list-style:square inside url(image.gif);

Tags: , , , , ,

星期三, 四月 28th, 2010 Web 没有评论

清除浮动clear:both在css中的使用

clear:both;

CSS手册上这样解释的:该属性的值指出了不允许有浮动对象的边。
这个属性是用来控制float属性在文档流的物理位置的。

当属性设置float(浮动)时,他所在的物理位置已经脱离文档流了,但是大多时候我们希望文档流能识别float(浮动),或者是希望float(浮动)后面的元素不被float(浮动)所影响,这个时候我们就需要用clear:both;来清除浮动

例子:

这个是第1列,

这个是第2列,

这个是列的下面。

如果不用清除浮动,那么第3个

的文字就会和第一二行在一起
所以我们在第3个这利加一个清除浮动。

这个是第1列,

这个是第2列,

这个是列的下面。

Tags: , ,

星期日, 四月 25th, 2010 Web 没有评论

微软Visual Studio 2010感人广告五部曲

编程无数,如何编译变幻莫测的爱情?喜怒哀乐是不是最难玩转的代码?爱情真的是一道无解的程序吗?

一个热衷于code的developer,一个热衷于developer的女孩,他们将发生怎样的故事?

来和一位程序员女友一起经历他们的酸甜苦辣,看她真心解密能够爱下去的坚定理由。

微软Visual Studio 2010 第一幕:想做你的code

微软Visual Studio 2010 第二幕:让爱延长

微软Visual Studio 2010 第三幕:幸福要敏捷

微软Visual Studio 2010 第四幕:为爱Debug

微软Visual Studio 2010 第五幕:让爱编译通过


Tags: , , , , , , ,

星期六, 四月 24th, 2010 网络 2 Comments

Ubuntu 10.04 LTS RC发布

今天,2010年4月23日,Ubuntu 开发团队发布了 Ubuntu 10.04 LTS 的 RC 版本。6天以后,也就是2010年4月29日, Ubuntu 10.04 将正式发布

上一张Ubuntu 10.04 LTS RC的截图

ubuntu10.04-lts-rc桌面截图

ubuntu10.04-lts-rc桌面截图

因为是从9.10 update上来的,flash显示中文不正常,用老方法解决这个问题

weiqk@weiqk-laptop:~$ sudo rm /etc/fonts/conf.d/49-sansserif.conf

Ubuntu 10.04:代号“Lucid Lynx”

LTS:长期支持

Tags: , ,

星期五, 四月 23rd, 2010 网络 没有评论

用Tynt防止别人剽窃你的文章

Tynt 提供免费的网站在线监测服务,如果有人COPY你网站上的内容,Tynt 可以检测到!
注册Tynt 后,将一段Javascript 放在你的网站上,将会检测所有的文章。
1、自动跟踪剽窃,保护您的知识产权
2、识别出你网站上最好的关键字,重新调整关键字以增加流量
3、通过自然流量来增加你网站的访问量
4、增加你搜索引擎的权重
地址:http://www.tynt.com/

Tags:

星期四, 四月 22nd, 2010 Web 没有评论

修改网站CSS哀悼青海玉树地震遇难同胞

新华网北京4月20日电 国务院决定,为表达全国各族人民对青海玉树地震遇难同胞的深切哀悼,2010年4月21日举行全国哀悼活动,全国和驻外使领馆下半旗志哀,停止公共娱乐活动。

http://www.gov.cn/jrzg/2010-04/20/content_1587276.ht

(志哀:用某种方式表示哀悼。致哀:对死者表示哀悼。“下半旗志哀”,表示全国用“下半旗”方式表示哀悼。)

Css黑白滤镜

html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
//或者html { filter: gray}

这个滤镜只对ie生效,而且需要html规范的头部描述

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

对flash如果滤镜不生效,还可以设置如下参数

<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>

wordpress修改样式表把css滤镜加进去

Tags: , ,

星期二, 四月 20th, 2010 Web 没有评论

WordPress All in one seo插件生成NoIndex对百度爬虫影响的解决方法

发现All in one seo 插件严重影响baidu收录,采取如下措施
1 在head模板加入如下正对googlebot的判断代码

<?php if ( !(is_home()) and !(is_single()) ) { ?>
<meta name=”Googlebot” content=”noindex,follow” />
<?php }?>

2 关闭All in one seo插件所有的生成Noindexde选项

Use noindex for Categories:
Use noindex for Archives:
Use noindex for Tag Archives:

Tags: , , , ,

星期六, 四月 10th, 2010 Web 一条评论

PR输出值

PR输出值定义:带给友情链接网站的PR值。
计算公式:(1 – 0.85) + 0.85 * (PR值 / 外链数)
这里把上面公式中的0.85就当成是1,则公式就可以简化为:PR输出值=PR值 / 外链数,从简化公式不难看出,当网站PR一定,外链数越多,则输出PR值则越小。
PR输出值的作用:即你链接上别人的网站,你网站就会分给对方0.29的PR值。 对本身网站的PR是没有影响的。 对别人的网站的PR值提升有一定的帮助,

Tags: , ,

星期五, 四月 9th, 2010 Web 没有评论

N73上安装putty连接SSH

今天在N73手机上安装了putty for s60 3nd,以后就可以用它来登录njava了。

一 软件下载
1 PuTTY for Symbian OS
http://s2putty.sourceforge.net/

现在已经到PuTTY 1.5.2了

2 因为我已经禁用了ssh的密码登录了,所以只能用密钥登录。要在putty上使用openssh生成的私钥,还需要PuTTYgen来转换密钥。

http://www.chiark.greenend.org.uk/~sgtatham/putty/download.html

二 安装使用

安装putty很简单,按一般s60的程序安装一样,因为开源,不需要破解

n73上的putty程序

n73上的putty程序

Putty的主界面很简洁,就四个设置卡

n73上putty的主界面

n73上putty的主界面

n73上putty的主界面ssh设置卡里设置ssh登录端口,ssh版本,私钥位置等等参数

n73上putty的SSH设置

n73上putty的SSH设置

n73上putty的SSH设置显示卡里设置屏幕风辨率和是否全屏显示,这些设置都可以通过快捷键来完成的

n73上putty的显示设置

n73上putty的显示设置

n73上putty的显示设置日志目录,最好设置到卡里

n73上putty的日志设置

n73上putty的日志设置

设置服务器地址和用户名

n73上putty的基本设置

n73上putty的基本设置

bear登录上了njava的服务器

登录njava成功

登录njava成功

登录njava成功把分辨率调到了最高,字很小设置putty的字体大小

设置putty的字体大小

设置putty的字体大小

N73上的top指令列目录看到的效果

N73上的top指令

N73上的top指令

ls目录

ls目录

ls目录

从巴士ping了一下baidu,3个287ms,还不错ping baidu.com

ping baidu.com

ping baidu.com

看来米国的网络就是好呀,ping米国的google速度嗷嗷的

ping Google.com

ping Google.com

断开SSH的链接,

断开SSH连接
断开SSH连接

教程结束。。。。

Tags: , , ,

星期一, 四月 5th, 2010 服务器 一条评论
Pages: Prev 1 2 3 4 5 6 7 8 9 10 ... 13 14 15 Next
1LMooBmUE153Wnd3zDryWvDyXxQudbFxDr