🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# 主题 <!-- Themes allow you to easily make your editor look good with minimal effort. Quill features two offically supported themes: [Snow](#snow) and [Bubble](#bubble). --> 通过主题设置,你可以容易的设置编辑器,花费最小的努力让编辑器好看。Quill官方提供两个有特色的主题:[Snow](#snow) and [Bubble](#bubble)。 ## Usage ```html <!-- Add the theme's stylesheet --> <link rel="stylesheet" href="{{site.cdn}}1.3.6/quill.bubble.css"> <script src="{{site.cdn}}1.3.6/quill.js"></script> <script> var quill = new Quill('#editor', { theme: 'bubble' // Specify theme in configuration }); </script> ``` ## Bubble <!-- Bubble is a simple tooltip based theme. --> Bubble是一个简单的基于提示起泡样式的主题。 ![](https://img.kancloud.cn/18/e5/18e5c3ca6ff166798e1ea0674d0737bb_778x305.png) <iframe height="265" style="width: 100%;" scrolling="no" title="Quill-full-bubble" src="https://codepen.io/liuwave/embed/JjoPyqY?height=265&theme-id=light&default-tab=css,result" frameborder="no" allowtransparency="true" allowfullscreen="true"> See the Pen <a href='https://codepen.io/liuwave/pen/JjoPyqY'>Quill-full-bubble</a> by 葡萄架 (<a href='https://codepen.io/liuwave'>@liuwave</a>) on <a href='https://codepen.io'>CodePen</a>. </iframe> ## Snow <!-- Snow is a clean, flat toolbar theme. --> Snow是一个简洁扁平化的工具栏主题。 <iframe height="265" style="width: 100%;" scrolling="no" title="Quill-full-snow" src="https://codepen.io/liuwave/embed/wvBwrJY?height=265&theme-id=light&default-tab=result" frameborder="no" allowtransparency="true" allowfullscreen="true"> See the Pen <a href='https://codepen.io/liuwave/pen/wvBwrJY'>Quill-full-snow</a> by 葡萄架 (<a href='https://codepen.io/liuwave'>@liuwave</a>) on <a href='https://codepen.io'>CodePen</a>. </iframe> ## 自定义 <!-- Themes primarily control the visual look of Quill through its CSS stylesheet, and many changes can easily be made by overriding these rules. This is easiest to do, as with any other web application, by simply using your browser developer console to inspect the elements to view the rules affecting them. --> 主题主要通过它的CSS样式表控制Quill的外观,通过重写这些样式可以容易改变quill的外观。像其它web应用一样,我们可以很容易的通过使用浏览器开发者控制台来检查作用在元素上的规则。 <!-- Many other customizations can be done through the respective modules. For example, the toolbar is perhaps the most visible user interface, but much of the customization is done through the [Toolbar module](/docs/modules/toolbar/). --> 可以通过对于的模块来进行很多定制。比如,最明显的用户界面工具栏就是主要是通过[工具栏模块](modules/工具栏toolbar.md)来定制的。