html, address,
blockquote,
body, dd, div,
dl, dt, fieldset, form,
frame, frameset,
h1, h2, h3, h4,
h5, h6, noframes,
ol, p, ul, center,
dir, hr, menu, pre   { display: block }
li              { display: list-item }
head            { display: none }
table           { display: table }
tr              { display: table-row }
thead           { display: table-header-group }
tbody           { display: table-row-group }
tfoot           { display: table-footer-group }
col             { display: table-column } 
colgroup        { display: table-column-group }
td, th          { display: table-cell; }
caption         { display: table-caption }
th              { font-weight: bolder; text-align: center }
caption         { text-align: center }
body            { margin: 8px; line-height: 1.12 }
h1              { font-size: 2em; margin: .67em 0 }
h2              { font-size: 1.5em; margin: .75em 0 }
h3              { font-size: 1.17em; margin: .83em 0 }
h4, p,
blockquote, ul,
fieldset, form,
ol, dl, dir,
menu            { margin: 1.12em 0 } 

h5              { font-size: .83em; margin: 1.5em 0 }
h6              { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6, b,
strong          { font-weight: bolder }
blockquote      { margin-left: 40px; margin-right: 40px }
i, cite, em,
var, address    { font-style: italic }
pre, tt, code,
kbd, samp       { font-family: monospace }
pre             { white-space: pre }
button, textarea,
input, object, 
select          { display:inline-block; }
big             { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub             { vertical-align: sub } 
sup             { vertical-align: super }
table           { border-spacing: 2px; }
thead, tbody,
tfoot           { vertical-align: middle }
td, th          { vertical-align: inherit }
s, strike, del  { text-decoration: line-through }
hr              { border: 1px inset }
ol, ul, dir,
menu, dd        { margin-left: 40px }
ol              { list-style-type: decimal }
ol ul, ul ol,
ul ul, ol ol    { margin-top: 0; margin-bottom: 0 }
u, ins          { text-decoration: underline }
br:before       { content: ”\A” }
:before, :after { white-space: pre-line } 

center          { text-align: center }
abbr, acronym   { font-variant: small-caps; letter-spacing: 0.1em }
:link, :visited { text-decoration: underline }
:focus          { outline: thin dotted invert }

/* Begin bidirectionality settings (do not change) */
BDO[DIR="ltr"]  { direction: ltr; unicode-bidi: bidi-override }
BDO[DIR="rtl"]  { direction: rtl; unicode-bidi: bidi-override }

[阅读全文...]

平时我们做网页的时候会用到img标签来插入图片，再结合a标签可以给图片加上链接，但是其实单独用a标签就可以实现这样的效果，而且可以在单个图片中插入多个链接。

本文的基本做法就是用CSS Sprites将多个图片合并为1个，用CSS中的background属性代替img标签，用background-position来实现多个图片链接的最终效果。

例如原来3个图片链接的HTML代码如下

<a href=”#”><img src=”http://…” /></a>
<a href=”#”><img src=”http://…” /></a>
<a href=”#”><img src=”http://…” /></a>

[阅读全文...]

本来两个div，并列显示，宽度加一块正好是父div的宽度，左面main float:left ，右面的sidebar float:left ，显示也OK了。

后来又改了别的CSS，接着又把 sidebar float改为right ，却莫名奇妙的不行了，改为left同样不行。。。郁闷了。后来把sidebar宽度减3，可以了，IE 3PX BUG我记得不是这样的哎。。。怎么这里又正好是3px，无奈。。。

后来用了网上说的一方法，sidebar宽度仍为原来的，margin:-3px  ，OK了。。。。但是心里还是不爽，我想让他float:right  不是left哎。。。虽然效果一样，但是心里不爽。。。超级不爽。。。。

要不是现在弄主题，早把IE6扔一边去了。。。垃圾！！！

今天无意中翻到了自己以前做的那些网页，感触甚多啊。

虽然当时的作品有很多缺点，甚至当时都不懂DIV ，CSS，更不懂什么浏览器兼容性，但是当时也是花了很大功夫去做，而且那时这样的作品也算是不错的。。。哈哈，自恋下。

这里共有两个作品，截图如下。

[阅读全文...]

细节决定成败，我觉得很有道理，我也不准备在这个问题上多说什么，只是拿这句话用用而已。

我的主题一直就是mg12的iNove，从开始用到现在几乎是每个能改的地方我都改了，有的朋友问我要我的改装版，不是我不愿给（我曾经给过一些朋友的），是因为很多改动的地方我自己都不记得了，更是因为许多地方我把那些动态的函数换成了静态的HTML代码，删删减减，如果你不是太懂网页，直接拿去用恐怕是很难的。

下面是我的一些细节的改动

1、导航栏首页链接及图标。

[阅读全文...]

一直以来我的CSS都是参考人家的，看着人家的怎样写然后自己一点点模仿，也没有注意什么规范，这并不是长久之计，学习下一些规范还是很有必要的，这份规范也是在网络上搜集的，目的是方便自己，方便大家，如果其中有错误请大家指正。

CSS命名规范

一．文件命名规范

全局样式：global.css；
框架布局：layout.css；
字体样式：font.css；
链接样式：link.css；
打印样式：print.css；

[阅读全文...]

爱折腾WP是我的一个习惯，不折腾就会手痒，哈哈~~此文仅作为一个精简CSS及JS在插件中调用的范例，其他插件的精简可以按照此文的方法来做。

众所周知，减少HTTP请求次数的一个途径是将CSS JS文件合并在一块，减少HTTP请求次数可以在一定程度上加快网页访问速度。为了速度，我就更加爱折腾了，呵呵。废话不多，下面是我今天的记录。

先提醒一下，在修改前一定做好备份，这是个绝对无害处的好习惯，下文不再提醒。

1、修改PageNavi的CSS调用，将其合并在主题目录中的style.css中（PageNavi是个WP分页插件，使用的人数还是不少的）。

[阅读全文...]

iNove的主题默认有个公告栏，我们可以方便的在这个主题里添加公告新闻之类的，但是遗憾的是没有图片修饰的公告栏比较难看，空空的，我便给他加了个小喇叭的图标，效果见本站首页导航栏下面。(CSS背景属性想必高手们都会了 此文针对我等小菜们 嘿嘿~~)

下面是iNove下style.cc中代码，搜索#notice 我的改为了如下代码

#notice {
 color:#080;
 padding-left:30px;
 margin-left:5px;
 font-size:15px;
 background:url(img/notice.gif) left no-repeat;
}

其中notice.gif可以从网上下载个，我感觉我现在的notice.gif还是不是我想要的，但是暂时还没找到更好的，凑合用吧。

[阅读全文...]