首页 > 产品研发 > CSS布局设计 顺口溜

CSS布局设计 顺口溜

2009年8月11日 发表评论 阅读评论

 
一、IE边框若显若无,须注意,定是高度设置已忘记; 

二、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中; 

三、三像素文本慢移不必慌,高度设置帮你忙; 

四、兼容各个浏览须注意,默认设置行高可能是杀手; 

五、独立清除浮动须铭记,行高设无,高设零,设计效果兼浏览; 

六、学布局须思路,路随布局原理自然直,轻松驾驭HTML,流水布局少hack,代码清爽,兼容好,友好引擎喜欢迎。 

七、所有标签皆有源,只是默认各不同,span是无极,无极生两仪—内联和块级,img较特殊,但也遵法理,其他只是改造各不同,一个*号全归原,层叠样式理须多练习,万物皆规律。 

八、图片链接排版须小心,图片链接文字链接若对齐,padding和vertical-align:middle要设定,虽差微细倒无妨。 

九、IE浮动双边距,请用display:inline拘。 

十、列表横向排版,列表代码须紧靠,空隙自消须铭记。


娃哈哈,随便逛逛发现的好东西。作为一个非专业人士,有些地方以前还真的没去注意过。

同时也推荐发现这篇文章的站点: csscools

分享家:Addthis中国
分类: 产品研发 标签: , ,
  1. 2009年8月11日18:45 | #1

    老蛋,抢沙发!

    蛋王 回复:

    @老饕,
    拽下来!

  2. 2009年8月11日18:46 | #2

    有意思,去csscools一游!

  3. 2009年8月11日22:54 | #3

    我还是没记住 哎!

    蛋王 回复:

    @卢松松,
    我也记不住,只是它里面提到的一些东西我以前没注意过,所以保存一下,哈。

  4. 2009年8月11日23:19 | #4

    我也没记住,唉,难怪我的语文成绩不咋样

    蛋王 回复:

    @歪豆,

    喝脑轻松!

  5. 2009年8月11日23:51 | #5

    虽说是顺口溜,但是如果每句再加上相关的解释的话那就最好不过了,这样对于我等啥都不懂的同志将会是一件幸事

  6. 2009年8月12日00:35 | #6

    :)
    这个好,要学习一下。确实,如果每句再加上相关的解释就更好了~~尤其对于初学的我来说~~呵呵 :-o

  7. 2009年8月12日00:47 | #7

    可以写成歌词 用唱

    蛋王 回复:

    @小熊,

    我想到了某个用青花瓷背化学元素表的老师。。

  8. 2009年8月12日09:12 | #8

    谁编的哈
    真牛
    期待写成RAP~

  9. 2009年8月12日09:27 | #9

    顺口溜还是太长

  10. 2009年8月12日12:59 | #10

    这个顺口溜不错哦 :wink:

  11. 2009年8月13日09:23 | #11

    记一下

  12. 2009年8月14日11:17 | #12

    :mrgreen: 还是很难记住,不过也学习了

    蛋王 回复:

    @滚天,

    呵呵,是啊,看来得改造一下。。

  13. 2009年8月18日14:35 | #13

    不太好记,不过很有意思。

    蛋王 回复:

    @小毅,

    呵呵,代表作者感谢你。。。 :wink:

  14. 2009年8月25日10:19 | #14

    呵呵,还真有意思,不过记不太住,我凭的全是经验

  15. 2009年8月25日11:06 | #15

    不错,我的样式总是不兼容

  16. 2009年9月3日18:00 | #16

    呵呵。。这个概括得有意思 。。

  17. 2009年9月8日13:12 | #17

    又重温了一下,这一条很容易忽视啊:
    二、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中;
    以前因为这个搞的很囧,或来才知道,clear的作用……

    蛋王 回复:

    @小毅,
    我也喜欢用clear。不过。。。某位大师说,clear是菜鸟最喜欢用的方法。。看来我要一直菜鸟下去了,因为我觉得这个很好用。。。

  18. 2009年9月11日15:32 | #18

    嘎嘎 这个我抄走了。

  19. 2009年10月1日23:51 | #19

    有口诀没有用,武功不是靠秘籍,而是靠锤炼,所以多做多看,才是王~

  20. 2009年12月25日21:50 | #20

    搬回家了, :mrgreen:

  1. 本文目前尚无任何 trackbacks 和 pingbacks.
= 10 - 9 (免费测一下智商)
Please leave these two fields as-is:
:wink: :-| :-x :twisted: :) 8-O :( :roll: :-P :oops: :-o :mrgreen: :lol: :idea: :-D :evil: :cry: 8) :arrow: :-? :?: :!: