V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
探索世界的好奇心万岁
Sponsored by
LinkedIn
不坐班的神仙工作 · 去任何你想去的地方远程,赚一线城市的工资
2000 个不用出门 Social 的全球远程工作,帮助 V2EX 的小伙伴开启全新的工作方式。
Promoted by LinkedIn
weakish
V2EX  ›  分享发现

markdown.css 让 HTML 显示成 markdown plain text 一样

  •  1
     
  •   weakish · 2014-04-30 12:09:45 +08:00 · 3288 次点击
    这是一个创建于 3073 天前的主题,其中的信息可能已经有所发展或是发生改变。
    看到一个好玩的 markdown.css http://segmentfault.com/a/1190000000487062 通过 CSS 让 HTML 显示成 markdown plain text。

    效果非常赞。几乎是纯 markdown 样式。除了图片(我开始以为是作者觉得图片显示成 ![](url) 的格式很蛋疼,后来才发现是只有 opera 支持 img 标签的 before after 伪类,其他浏览器都不支持,因为作者追求纯 CSS 实现,所以就没转图片

    嗯,用 markdown 写东西,然后转成 HTML,再用这个 markdown.css “转回来”,实在是有(zhen)逼(dan)格(teng)~
    7 条回复    2014-04-30 14:55:09 +08:00
    jakwings
        1
    jakwings  
       2014-04-30 12:25:50 +08:00
    img { display: inline-block; } 就可以支持 ::before 和 ::after 了吧?
    jakwings
        2
    jakwings  
       2014-04-30 12:34:14 +08:00
    @jakwings 啊,不对,貌似不加 inline-block 就可以用伪元素了。不知道他为什么非要那样。
    jakwings
        3
    jakwings  
       2014-04-30 12:35:35 +08:00
    才发现是一年前的东西,估计是 CSS 引擎又有变化了……
    jakwings
        4
    jakwings  
       2014-04-30 12:37:29 +08:00
    img { content: "" } 就可以解决 webkit 引擎的问题。
    linuxer
        5
    linuxer  
       2014-04-30 14:06:39 +08:00
    @jakwings 是我穿越了吗?这个 ‘img:after’ 好几年前就被 Firefox 等浏览器支持了(那时 Chrome 都还未出生)。
    jakwings
        6
    jakwings  
       2014-04-30 14:10:33 +08:00
    @linuxer 应该不是支持不支持的问题吧,而是伪元素的内容是否会显示出来。
    weakish
        7
    weakish  
    OP
       2014-04-30 14:55:09 +08:00
    原来 `img {content: ""}` + 去掉 inline-block! @jakwings 赞!
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   1205 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 38ms · UTC 19:37 · PVG 03:37 · LAX 12:37 · JFK 15:37
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.