让主题通过 W3C CSS3 验证
最近比较忙,同时有沉迷于各种东西。。。(什么逻辑,忙还能沉迷其他的)
好久没折腾了,博客要长草了,惭愧。是该稍微重视下。
“武艺之道是从整理出清爽舒适的空间开始”。恩,吐槽语里面还是有几句靠谱的。
好吧,不只是武艺,其实各种方面都是如此,博客亦如此,既然空间什么的暂时动不了,那就 WordPress 主题吧,动的就是你。
其实这个主题最原始的状态,是可以通过 W3C 验证的,但我是折腾着玩,也就没有考虑标准什么的,而且还有考虑各个浏览器的兼容问题。验证就杯具了。
趁此机会还是让它通过验证好。
恩,看到绿色的对勾会有那么一点点满足感。 😳
虽然往往标准和浏览器的兼容总是冲突的,不遵守规范和不那么遵守的都很多。
但解决方法也很简单,就是把 box-shadow 和其他的私有属性(-moz 之类的)放到js里面输出。
这是 Willin Kan 大师在 A9 主题中的做法,值得借鉴。
另外 XHTML 验证中出现了一下莫名其妙的错误。。不懂,暂时不折腾,不要太过分执着。
» 转载请以超链接形式注明来源:A.shun Blog » 《让主题通过 W3C CSS3 验证》
» 本文链接地址:http://shun.im/21409
sf
哈哈,看完后前排坐住
xhtml有一些小错误,很好解决啊
@winy 恩,有空研究下,不懂再请教
css3不知道要怎么通过 看来我要再看看a9主题
@BoKeam 值得研究,里面很多精华
记得当初折腾验证很烦人,所以就爱咋咋样,不通过就不通过。= =
@Vicia inove默认也是过的。。
恭喜啊,不过没明白这个验证有什么用?
@婉秋 没啥用,就是告诉别人你遵守标准
偶已经没有时间折腾了orz
@lovee 我也是啊,最近没劲
首页的 go to comments都删了吧- -点了半天还没反应。。
文章页都是小问题~加油改
@snowxh 那个首页的第一个 go to comments 的问题我知道怎么回事了,下次修复
以前想通过就为挂个标志..
@安 那就小折腾下嘛
以前挺在乎的,现在无所谓了……
@阿修 无所谓,别被束缚了
哈,现在我所有的主题用到私有属性的统统放JS里,向willin大师学习
这些检验,我也不太在乎,因为对我改善浏览器兼容性没多大帮助。。
@QiQiBoY 这个作用真的不大,不过代价不高就稍微折腾了下
要通过验证
园子博客是别想了
哈哈。
现在觉得不太想折腾博客,连升级都懒,只想偶尔写写就行了 😡
@derek 我最近也是没折腾,感觉很没劲,唉
@A.shun 那就休息休息吧
查看: 错误 (25) 警告 (40) 已经校验的层叠样式表
╮( ̄▽ ̄||)╭,杯具 ~
@小邪 呵呵,稍微折腾下嘛
💡 小邪大半夜的不睡觉…
额..不对时区不一样…
我的过不了,也不知道怎么改
@志言 检测的时候会指出错在哪里的,很好解决
这个东西,不是必要的
😮 啊。这个是一个很牛的验证吗?啊哈哈。 ➡
@Snow 只是标准验证嘛,不牛不牛 😛
我的css验证就会剩下:-moz-、-webkit-,你知道的 😀
@zwwooooo 也放到js输出吧,好歹你是主题作者嘛,有个通过验证的标记好些
我的CSS 没通过!杯具啊!
你果然文囧……
咳,话说,我现在CSS和XHTML又不过了,因为放插件的原因……
算了,我淡定了……
@静夜燃香 几个私有属性嘛,春菜导致的 ❗
我算是有阵子没来的人了。
尽量通过就行了,没必要非得通过呀。
我的都没有通过,还有几个错误,不过不是模板和程序的问题,而是一个侧边栏得要个订阅按钮好像有问题
@学夫子 你的那个错误都是私有属性引起的,很好解决。把-moz-和-webkit-用js输出。参考A9。
另外,-khtml-border-radius和-webkit-border-radius 已经不需要了,chrome圆角方面支持标准的border-radius,换成这个就好。而这样IE9和Opera也能显示圆角。
过来瞧瞧
你太强了。css3都用上了。
😛 嘿嘿 不错不错~我没申请。。。
我也有阵子没更新了,你还比较勤快了
最好也能通过HTML的校验哈。
这东西也太折腾人啦
难得用OP,怎么能不来狠狠踩一脚呢!!!! 😎
@zwwooooo Test 😆
中秋将至,送上祝愿,一送月圆不用花钱,二送人圆没有时限,三送梦圆努力实现,四送佳缘幸福美满,五送我心愿,祝你天天开心无极限佳节!。
天啊,我的竟然有45 Errors, 8 warning(s) 。
我已经精疲力尽了,以前那万恶的CNZZ统计代码是肯定不能过W3C的。
通过之后然后呢?
psd转化成div+css
高水平的切图服务,符合w3c验证, 兼容浏览器,300元/张,你看你谷歌广告都变成这样的了。
在ie6下显示怎么样?
@睿智小超人 IE6很多东西和标准相背的。
我的主题在IE6下基本正常,不管了。
修改的过程中眼睛看得花吧~
@merror 不会啊,这还算方便。
我要自已设计一个主题了
@Yibie 有时间折腾的话,那挺好的。
懒得 再把 css 偷换到 js里面了、、不标准就不标准吧、、反正 每个浏览器 都有 私有属性的 额、、
@Kars 有是有,不过Opera对css3的支持基本上不需要私有属性的。
@A.shun 浏览器不止 Opera ~ 😎
@Kars 是不止啊。但box-shadow这样的属性只有o有效。圆角也差不多。
其他的要加上-moz、-webkit什么的。
如果不考虑那些,我就不用把本来只有一行的代码写成一坨坨的 😡
嘛,FF的访客朋友蛮多,我会注意兼容的。
@A.shun 为了效果好,那也是 木有办法的事情、、o(*^▽^*)o
看了看你的CSS,发现 有些相同的图片 重复加载了、、
完全可以 这样来写,把背景图相同的,写到一块儿:
.feed1 a,a[href^=http://feeds2.feedburner.com/],.feed2 a,a[href^=http://feed.a-shun.com/],.feed3 a,a[href^=https://www.google.com/reader/] {background:url(images/icons.gif) no-repeat;}
然后,再分别设置背景图的位置:
.feed1 a,a[href^=http://feeds2.feedburner.com/] { background-position:0 -180px; }
这样写的话,就可以 减少 HTTP请求 了、、o(* ̄▽ ̄*)o
@Kars 原来还可以这样。
我以为相同图片就不用请求了,其实还是要检查一遍的。
.feed1 a这种是为了照顾某浏览器= =,唉。
下次折腾,感谢提醒。
@Kars 话说你换域名了?这个好短
@A.shun 还有 一件关于 你博客的CSS 的事、、
记得上次 偶建议 把 .page-numbers:hover{border:1px solid #F73B00;} 改为 a.page-numbers:hover{border:1px solid #F73B00;}
那个是 评论翻页的CSS吧、、
其实,上次 没说明白、、因为 class=”page-numbers” 的标签 有两个 a 和 span。按照原来写的,当鼠标 放到 a.page-numbers 上,会变红色;放到 span.page-number 同样也会变红色、、然后,就 感觉 比较 奇怪了、、
@Kars 囧,连框也变色,这就是我要的效果啊。只是链接变色不醒目嘛 ❗
@A.shun 但是 不是 链接 的 框 也会 变成红色啊、、把鼠标 放到 这个 页面的 评论列表 的 “2” 那个 当前 页码 上、、 ❗
@Kars 好吧,你实在太细心了。
下次一起改
@A.shun 大家都是我学习的榜样~ 榜样的错误 也是要 指出的~~ 😛
恭喜恭喜~~
个人觉得,验证只是为了让你发现你无意间写的语法错误,不一样的非要追求验证,只要是对的就行。
@西门 有道理
主在chrome 和opera下非常漂亮。 😀
恩,我还没验证过标准,以后再验证把
哇,很恐怖,我一大堆错误
css3验证也真是够怪的,-moz 都不知道。
Just here to greet all you peasants in the comment section. Hehe
My blog – clavon condo Price list
@Katkat & Dale Real Estate Vlog Btw, what does premier Irwell Hill Residences Condo Showsuite means?
Are other SMDC condos not premier?