美文网首页
Web编辑器?啥玩意儿

Web编辑器?啥玩意儿

作者: 运营小白的试验基地 | 来源:发表于2016-11-01 16:24 被阅读0次

web编辑器是个啥东西?作为一个特别不喜欢看专业书籍的坏学生,我上网问了一下度娘。

度娘上基本上有两种解释:
1.就是在web上进行编辑的编辑器
2.就是用来编辑web的编辑器

哈哈哈感觉说了两句废话。

那就先说在web上进行编辑的编辑器####

说简单点呢,就是在网页上直接进行编辑,也是我现在最喜欢用的编辑方式了
别问我为啥,我才不会告诉你因为不用下载软件,电脑不会卡这种原因呢。
对于文案的编辑,现在主流的编辑方式一般有两种,一种比较简单的在线HTML编辑器,还有一种我现在正在用的markdown编辑器

别着急,我们来一个一个介绍:

第一开始的时候,我用过一个编辑器,叫做UEditor

在当时各种微信浏览器还没有泛滥的时候,UEditor作为跟微信编辑器内核一样的编辑器简直相当好用啊,比微信公众平台的内置编辑器好用多了,还可以直接进行HTML代码编辑,绝对神器。

界面长这样:


后来随着公众号越来越泛滥,各种类似的编辑器越来越多
当然,编辑器上的内置样式也变得越来越多。我开始用135编辑器

界面长这样:


申请账号之后可以直接对各种样式进行收藏,这对于小白来说是最好办不过的了。
各种样式都是编辑器上用HTML代码写好的,直接使用就可以了,简直一大神器。

作为一个傻瓜工具,我们在使用的时候可是不能大意,因为真正的大神可都是将傻瓜工具用出了❀的~~

比如下图中这个样式,小白同志们当然只能改改上面的文字啦

更爱研究点的会改改这里:


但是是不是经常发现样式修改完之后显示有问题呢?

没关系,点这里:


点开之后会发现变成了这样:

    <section class="_135editor" data-tools="135编辑器" data-id="86323" style="position: relative;">
<section style="margin-top: 0.5em; margin-bottom: 0.5em; padding-left: 0.5em; padding-right: 0.5em; text-align: center; position: static;">
    <section style="position: static;box-sizing: border-box;transform: rotate(0.1deg);-webkit-transform: rotate(0.1deg);-moz-transform: rotate(0.1deg);-o-transform: rotate(0.1deg);">
        ![](https://img.haomeiwen.com/i3487541/cf8128f793c2bb70?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    </section>
    <section class="layout" style="padding: 7%; box-shadow: rgb(204, 204, 204) 0.3em 0.3em 0.3em; width: 90%; margin-right: auto; margin-left: auto; background-color: rgb(239, 239, 239);" data-width="90%">
        <section class="135brush">
            <p>
                无所谓从哪儿来,也无所谓到哪儿去。 为活着找个理由,只为更好的活着。From 史铁生《命若琴弦》
            </p>
        </section>
    </section>
</section></section><section data-role="paragraph" class="_135editor">
</section>

先不要着急蒙圈,看看我们能不能试着修改一些简单的东西

<p> 无所谓从哪儿来,也无所谓到哪儿去。 为活着找个理由,只为更好的活着。From 史铁生《命若琴弦》 </p>

如果在<p> </p>之间修改文字,整个样式就不会变形啦~

background-color: rgb(239, 239, 239)

修改上面这个颜色代码,就能得到好多编辑器里面没有的颜色,自己配色的感觉相当爽有木有,颜色代码用Photoshop取值就可以得到啦。

而样式的宽度则可以在width: 90%进行调节。可能刚上手的小编会有些困难,不过只要愿意,自己在编辑器中多试两遍就一定能学会的,这样就不用再怕整个素材变形了。

今天这个就先说这么多,一定要自己试验过就知道了,大部分此类编辑器内核都是一样的,可以适当选用~~

下一篇说说markdown编辑法吧。

相关文章

  • Web编辑器?啥玩意儿

    web编辑器是个啥东西?作为一个特别不喜欢看专业书籍的坏学生,我上网问了一下度娘。 度娘上基本上有两种解释:1.就...

  • 地理生物链

    消费—经济—就业—消费… 是不是人民生产总值啥玩意儿的~ 收入—消费—经济—就业—收入… 哦…啥玩意儿啊。

  • 啥玩意儿!

    我如果昏沉,风刮的凄凉,雨下的冰冷, 我如果清爽,风刮的自由,雨下的畅快, 天气转凉,我如果寒冷,加衣无用, 我如...

  • 啥玩意儿

    这几天明显的感觉是没有那么冷了,走路开始蹦哒,大大的棉袄裹住我,我就不想安生的走路说话,就想跳着蹦哒着

  • 啥玩意儿

    在我的话,有一天下大雨啦

  • 简书

    编辑器 加粗斜体谢啥

  • Web 前端常用工具推荐

    开发工具 Web 前端编辑器 - Visual Studio Code Markdown 编辑器阅读器 (Mac/...

  • web前端入门

    Web入门 Web概述 安装基本软件 text editor(文本编辑器)Visual Studio CodeSu...

  • 常用编辑器大全

    一、富文本编辑器 1、UEditor UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有...

  • [力场初体验]来得早不如来得巧——也谈MarkdownHere对

    1.力场Web端发文编辑器明显是个薄弱点 力场作为新生代UGC,一个明显不足,就是Web端编辑器功能薄弱。 所以,...

网友评论

      本文标题:Web编辑器?啥玩意儿

      本文链接:https://www.haomeiwen.com/subject/blcmuttx.html