Eclipse 4.2 中的轻量级 CSS 编辑器
jopen 12年前
<h1>CSS in Eclipse 4.2 </h1> <p>在 Eclipse 4.2 的设置中，一些关于颜色和字体的设置改用了 CSS 进行设置。例如 <i>General > Appearance > Colors and Fonts</i> 设置界面。</p> <p>Eclipse SDK 使用主题对 CSS 样式单进行分组，用于对工作区进行风格设定，你可以在<i>INSTALL/plugins/org.eclipse.platform_4.2.0.qualifier/css</i> 文件中查看这些 CSS 设定。</p> <a name="Editing_the_CSS_in_eclipse" rel="nofollow"></a> <h2>在 Eclipse 中编辑 CSS</h2> <p>现在可以使用 Eclipse 提供的轻量级 CSS 编辑器来修改外观，首先进入 E4 安装网站并安装 <i>E4 CSS editor (Incubation)</i>. 重启后进入 <i>General > Appearance</i> 选项页来修改 CSS。</p> <ul> <li>E4 update site <a href="/misc/goto?guid=4958346091099790102" rel="nofollow">http://download.eclipse.org/e4/updates/0.12</a> (after release)</li> <li>E4 update site <a href="/misc/goto?guid=4958346091953487855" rel="nofollow">http://download.eclipse.org/e4/updates/0.12-I-builds</a> (during development)</li> </ul> <p><span><img style="width:543px;height:575px;" alt="Eclipse 4.2 中的轻量级 CSS 编辑器" src="https://simg.open-open.com/show/29a71d577c599c4012fc2d9c041b3cf2.png" width="736" height="781" /></span> </p> <a name="Modifying_your_own_style_sheet" rel="nofollow"></a> <h2>修改 CSS 样式单</h2> <p>你可进入 <i>General > Appearance</i> 选项页来定义自己喜好的外观。</p> <a name="Removing_customizations" rel="nofollow"></a> <h3>删除定制样式</h3> <p>通过 <b>Restore Defaults</b> 按钮可以移除所有的自定义样式并恢复为默认的设定：<i>plugins/org.eclipse.platform</i>.</p> <a name="Switch_to_single_editor_tab_mode" rel="nofollow"></a> <h3>切换为单编辑器 tab 模式</h3> <p>通过添加如下 CSS 来切换到但编辑器的 tab 模式</p> <pre class="brush:css; toolbar: true; auto-links: false;">#org-eclipse-ui-editorss CTabFolder.MPartStack { swt-single: true; }</pre> <p><a name="Switching_tab_styles" rel="nofollow"></a></p> <h3>切换 tab 样式</h3> <p>经典的主题支持 2.1 和 3.x 风格的 tab，你可编辑 <i>.MPartStack </i>中的 <b>swt-simple</b> 属性进行修改，前提是 <b>swt-tab-renderer</b> 设置为 <i>null</i>.</p> <pre class="brush:css; toolbar: true; auto-links: false;">.MPartStack { swt-tab-renderer: null; swt-selected-tabs-background: #FFFFFF #ECE9D8 100%; swt-simple: true; swt-mru-visible: true; }</pre> <p><a name="Reducing_the_tab_font_size" rel="nofollow"></a></p> <h3>减小 tab 的字体大小</h3> <pre class="brush:css; toolbar: true; auto-links: false;">.MPartStack { font-size: 9; swt-simple: false; swt-mru-visible: false; }</pre> <h1>CSS 实现细节</h1> <ul> <li><a href="/misc/goto?guid=4958346092745724968" rel="nofollow">E4/CSS</a> </li> <li><a href="/misc/goto?guid=4958346093545590896" rel="nofollow">E4/CSS/SWT Mapping</a> </li> <li><a href="/misc/goto?guid=4958346094337504425" rel="nofollow">Eclipse4/RCP/CSS</a> </li> </ul> <p><a href="/misc/goto?guid=4958346095123614033" rel="nofollow" target="_blank">英文原文</a>，OSCHINA原创翻译</p>