cooljs
V2EX  ›  问与答

css 有自动化生成方案吗?

  •  
  •   cooljs · Aug 31, 2018 · 2999 views
    This topic created in 2988 days ago, the information mentioned may be changed or developed.

    比如我先在某个地方调整好页面 dom 结构,然后对相应的节点选择样式,比如水平居中,点击选项后,样式文件自动加上

    text-align:center;
    

    过程可能是这样:

    1. 在网站手动拖动标签生成 dom 结构;
    2. 点击生成的标签,弹出各种 css 效果;(比如我选择了一个header标签,弹出一些样式,包括基本的高度宽度,内外边距,border,颜色,字体大小等等)
    3. 然后选择想要的样式,自动生成相应的 css,最后导出生成的 css 文件即可。

    当然生成的可能都是比较基本的样式,毕竟 css 很复杂,但就这些基本的样式感觉也省了不少时间精力。
    问下有没有类似的网站或者方案之类的。

    21 replies  •  2018-09-03 13:24:46 +08:00
    molvqingtai
    molvqingtai
    Aug 31, 2018 via Android
    1
    墨刀
    cooljs
    cooljs
    OP
    Aug 31, 2018
    2
    @molvqingtai 墨刀只是设计图生成标注吧
    cluulzz
    cluulzz
    Aug 31, 2018
    3
    emmm 可视化编辑? Adobe Dreamweaver
    xxx749
    xxx749
    Aug 31, 2018 via Android
    4
    自己做也不难啊
    shapl
    shapl
    Aug 31, 2018
    5
    Dreamweaver 帮到你。。
    ChiangDi
    ChiangDi
    Aug 31, 2018
    6
    Dreamweaver
    CSGO
    CSGO
    Aug 31, 2018
    7
    Dreamweaver 哪有可视化?我怎么用这么久都不知道?
    cooljs
    cooljs
    OP
    Aug 31, 2018
    8
    @CSGO 我在下载,想体验一下呢 0.0
    cooljs
    cooljs
    OP
    Aug 31, 2018
    9
    @shapl
    @ChiangDi

    @cluulzz
    在下载,看下是什么样的
    cooljs
    cooljs
    OP
    Aug 31, 2018
    10
    @xxx749 比较复杂,有现成的就不用重复造轮子了
    lrz0lrz
    lrz0lrz
    Aug 31, 2018
    11
    基本样式不如手写

    复杂样式?肯定会出一堆乱七八糟的问题

    比如垂直水平居中,至少有 10 种方法,每种方法都有缺点
    cooljs
    cooljs
    OP
    Aug 31, 2018
    12
    dw 的 css 设计器不是我想要的那种。。
    cooljs
    cooljs
    OP
    Aug 31, 2018
    13
    @lrz0lrz 暂时考虑的是基本的样式,复杂的未考虑。
    基本样式比如高度只需要在一个 input 里输入数值就可以了,美滋滋~
    P233
    P233
    Aug 31, 2018
    14
    一直在研究这个方向,初步有点效果了,但距离完成还有很长一段路。

    终极目标是做一款能够直接导出高质量 HTML + CSS 代码的设计工具。
    Xiqiuqiu
    Xiqiuqiu
    Aug 31, 2018
    15
    之前看到过一些,不一定能满足需要 Link:http://www.imooc.com/article/1443
    leekafai
    leekafai
    Aug 31, 2018 via Android
    17
    蓝湖
    noe132
    noe132
    Aug 31, 2018
    18
    css 肯定是很那达到这样的水平的。

    封装的组件可以暴露一些这样的属性。
    noe132
    noe132
    Aug 31, 2018
    19
    fix: css 肯定是很难达到这样的水平的。
    cooljs
    cooljs
    OP
    Sep 3, 2018
    20
    @P233 厉害了,开源吗
    cooljs
    cooljs
    OP
    Sep 3, 2018
    21
    @Xiqiuqiu 谢谢
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1375 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 45ms · UTC 22:46 · PVG 06:46 · LAX 14:46 · JFK 17:46
    ♥ Do have faith in what you're doing.