hjg
2024-07-09 30304784e82d4bba24121328da8eb8490aec4f4f
提交 | 用户 | 时间
58d006 1 <!DOCTYPE html>
A 2 <!--
3 Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
4 For licensing, see LICENSE.html or http://ckeditor.com/license
5 -->
6 <html>
7 <head>
8     <title>UI Color Picker &mdash; CKEditor Sample</title>
9     <meta charset="utf-8">
10     <script src="../ckeditor.js"></script>
11     <link rel="stylesheet" href="sample.css">
12 </head>
13 <body>
14     <h1 class="samples">
15         <a href="index.html">CKEditor Samples</a> &raquo; UI Color
16     </h1>
17     <div class="description">
18         <p>
19             This sample shows how to automatically replace <code>&lt;textarea&gt;</code> elements
20             with a CKEditor instance with an option to change the color of its user interface.<br>
21             <strong>Note:</strong>The UI skin color feature depends on the CKEditor skin
22             compatibility. The Moono and Kama skins are examples of skins that work with it.
23         </p>
24     </div>
25     <form action="sample_posteddata.php" method="post">
26     <p>
27         This editor instance has a UI color value defined in configuration to change the skin color,
28         To specify the color of the user interface, set the <code>uiColor</code> property:
29     </p>
30     <pre class="samples">
31 CKEDITOR.replace( '<em>textarea_id</em>', {
32     <strong>uiColor: '#14B8C4'</strong>
33 });</pre>
34     <p>
35         Note that <code><em>textarea_id</em></code> in the code above is the <code>id</code> attribute of
36         the <code>&lt;textarea&gt;</code> element to be replaced.
37     </p>
38     <p>
39         <textarea cols="80" id="editor1" name="editor1" rows="10">&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;</textarea>
40         <script>
41
42             // Replace the <textarea id="editor"> with an CKEditor
43             // instance, using default configurations.
44             CKEDITOR.replace( 'editor1', {
45                 uiColor: '#14B8C4',
46                 toolbar: [
47                     [ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
48                     [ 'FontSize', 'TextColor', 'BGColor' ]
49                 ]
50             });
51
52         </script>
53     </p>
54     <p>
55         <input type="submit" value="Submit">
56     </p>
57     </form>
58     <div id="footer">
59         <hr>
60         <p>
61             CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
62         </p>
63         <p id="copy">
64             Copyright &copy; 2003-2013, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
65             Knabben. All rights reserved.
66         </p>
67     </div>
68 </body>
69 </html>