爱意满满的作品展示区。
yukirock

ty.css,简单易用的排版样式集

  •  1
     
  •   yukirock · May 13, 2014 · 4490 views
    This topic created in 4390 days ago, the information mentioned may be changed or developed.
    https://github.com/chadluo/ty.css
    http://ty.yukir.net/

    基于 Baseline 的排版样式。将常见字号 16px 的一半 8px 作为 Baseline 高度,以此做出来的排版样式集。

    只关注垂直间距与字号,不关注字体、颜色、Grid system 以及其它复杂样式,请搭配自己的方案测试使用。

    为正文亲元素添加 ty 的 class 即可使用。默认样式为:1.5 倍行高,第二段起缩进以区分段落。添加 ty-wide 的 class 可改为 2 倍行高。添加 ty-p-spacing 的 class 可改为以增加行间距以区分段落。

    目前只做了这些简单的功能,还望各位多多指教。

    非常感谢。
    4 replies    2014-05-14 12:32:43 +08:00
    orzfly
        1
    orzfly  
       May 14, 2014
    看到最后一句话突然泪目……
    RockyLee
        2
    RockyLee  
       May 14, 2014
    效果真棒
    ivanlw
        3
    ivanlw  
       May 14, 2014
    简单扫了一遍,觉得很棒……请问是楼主自己总结的吗?

    顺便推荐Google HTML/CSS Style Guide:
    https://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml#ID_and_Class_Naming
    yukirock
        4
    yukirock  
    OP
       May 14, 2014
    @ivanlw 倒不算是總結,因爲一開始就是要實現 Baseline 的。期間試了很多寫法最後決定用現在這樣的。

    Style Guide 以前也看到過,不過自己寫的時候纔懶得看呢= =
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5771 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 48ms · UTC 03:06 · PVG 11:06 · LAX 20:06 · JFK 23:06
    ♥ Do have faith in what you're doing.