CodeMirror中文說明文檔

文檔大綱

本文檔並未完全翻譯完成,我需要你的幫助。前往GitHub編輯

自定義樣式

可以修改样式文件来调整 CodeMirror 的外观。
Mode 提供的样式文件只定义了该 Mode 的颜色,可直接修改。
編輯器的外觀可以直接修改或覆蓋 lib/codemirror.css 來調整。

修改该文件需要注意一些规则,如应使用安全色等,该文件需要包含以下 class :

CodeMirror
編輯器的父級元素,一般用來設置編輯器的寬、高、邊框和定位。
也可以用來設置編輯器內元素的通用樣式(如字體類型、字體大小、背景等)。
設置 heightauto 可以讓編輯器自適應高度 (推薦把 viewportMargin 选项設置爲 Infinity 配合使用)。
CodeMirror-focused
编辑器失去焦点时,最顶层的元素使用该 class 。一般用来在编辑器失去焦点时隐藏光标、修改选区颜色。
CodeMirror-gutters
侧边栏最底层元素的 class 。一般用来設置侧边栏的背景,或爲侧边栏增加右边框。
CodeMirror-linenumbers
用来設置行号侧边栏的背景或宽度。
CodeMirror-linenumber
用来設置行号侧边栏中具体的数字的样式。
该 class 不是 CodeMirror-linenumbers 的子级, 但会使用绝对定位将其覆盖在 CodeMirror-linenumbers 之上。
可以設置数字的对齐方式或数字的样式。
CodeMirror-lines
用来設置内容行的垂直内填充。
CodeMirror-cursor
光標是一個使用絕對定位的塊元素,可以隨意修改它的外觀。
CodeMirror-selected
选区使用该 class 。
CodeMirror-matchingbracket, CodeMirror-nonmatchingbracket
用来設置匹配的(或不匹配的)的括号。

如果你爲页面中的所有 divpre 都設置了样式(不推荐), 你必须定义规则来消除对 CodeMirror 的影響。

主题也是 CSS 文件,用来给关键字着色。参考 theme 目錄下的文件。