# 主題
<!--
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是一個簡單的基于提示起泡樣式的主題。

<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)來定制的。
- 前言
- 快速開始(quick_start)
- 下載(download)
- 配置(configuration)
- 格式(formats)
- API
- 內容(contents)
- 格式化(formatting)
- 選區(selection)
- 編輯器(editor)
- 事件(events)
- 模型(model)
- 擴展(extension)
- 增量(Delta)
- 模塊(modules)
- 工具欄(toolbar)
- 鍵盤(keyboard)
- 歷史記錄(history)
- 粘貼板(clipboard)
- 語法高亮(syntax)
- 主題(themes)
- 更多教程
- 為什么選擇Quill?
- 如何定制Quill?
- 設計Delta格式(未翻譯)
- 構建一個自定義模塊
- 將Quill加入你的編譯管線(未翻譯)
- Cloning Medium with Parchment
- 和其它富文本編輯器的對比(未翻譯)
- Designing the Delta Format
- 擴展模塊
- vue-quill-editor
- quill-image-extend-module
- quill-image-resize-module
- quill-image-drop-module
- quill-better-table
- quilljs-table
- 更多模塊