Question

我正在使用YUI富文本编辑器（YAHOO.widget.Editor），除了一件事，我还能正常工作。我无法弄清楚如何配置我在编辑器框中输入的文本的字体大小（输入类型=“textarea”）。我希望该文本为150％。我知道我需要一个表格的CSS规则：

some-YUI-related-selector {
  font-size: 150%; 
}

但我无法弄清楚“某些与YUI相关的选择器”的身份。

我很感激我能得到任何帮助。

谢谢，杰伊

更多信息：

我希望我的网页显示大字体，所以我使用CSS样式来讨论div：

div.newsform {
  font-size:120%;
}

div.newsform input {   
  font-size:120%;
}
input#newsgoals {
  font-size:150%;
}

有问题的HTML网页摘要是：

<div class="newsform">
  <p>Some text</p>
  <form>
    <input type="text" name="sname"  style="width:353px"/>
    <input type="textarea" id="newsgoals" name="newsgoals" ></input><br/>
    <input type="submit" value="Add" />
  </form>
</div>

我将YUI编辑器绑定在网页底部的Javascript代码段中，如下所示：

<script>
var myNewSEditor = new YAHOO.widget.Editor('newsgoals', {
    height: '300px',
    width: '440px',
    dompath: false,
    animate: true,
    css: YAHOO.widget.SimpleEditor.prototype._defaultCSS, // + 'html { font-size:130%; }',
// { css: YAHOO.widget.SimpleEditor.prototype._defaultCSS + 'ADD MYY CSS HERE' }
    toolbar: {
        titlebar: 'Write Your Goals Here',
        buttons: [
            { group: 'textstyle', // label: 'Font Style',
                buttons: [
                { type: 'push', label: 'Bold', value: 'bold' },
                { type: 'push', label: 'Italic', value: 'italic' },
                { type: 'push', label: 'Underline', value: 'underline' },
                { type: 'separator' },
                { type: 'select', label: 'Arial', value: 'fontname', disabled: true,
                    menu: [
                        { text: 'Arial', checked: true },
                        { text: 'Arial Black' },
                        { text: 'Comic Sans MS' },
                        { text: 'Courier New' },
                        { text: 'Lucida Console' },
                        { text: 'Tahoma' },
                        { text: 'Times New Roman' },
                        { text: 'Trebuchet MS' },
                        { text: 'Verdana' }
                    ]
                },
                { type: 'spin', label: '22', value: 'fontsize', range: [ 9, 75 ], disabled: true },
                { type: 'separator' },
                { type: 'color', label: 'Font Color', value: 'forecolor', disabled: true },

                { type: 'push', label: 'HTML Link CTRL + SHIFT + L', value: 'createlink', disabled: true }
                ]
            }
        ]
    }
});
myNewSEditor.render();


</script>

div中的所有内容（class =“newsform”）将字体渲染为120％，除了YUI编辑器，它继续渲染得非常小。如果我在没有YUI编辑器的情况下使用网页，则文本区域（输入#newsgoals）正确地呈现150％。

我能够在YUI编辑器的工具栏中配置颜色和字体大小，但不能在文本区域框中配置。

我甚至尝试在工具栏中配置'css：'属性，然后将我的CSS规则添加到_defaultCSS（根据YUI编辑器文档），但它不起作用。

Answer 1

周杰伦，

此组件的作者Dav Glass在YUI图书馆论坛上为他的用户提供了很多帮助：http://yuilibrary.com/forum/

如果你在这里没有得到答案，一定要尝试在那里发帖。

-Eric

Answer 2

哇噢！谢谢Eric Miraglia。指向Dav Glass' forum的指针让我得到了我需要去的地方。

出于某种原因，我发现css：配置参数是正确的，但我做了别的错误，导致它失败。正确答案是将以下行放在我拥有css的位置：当我调用“new Yahoo.widget.Editor（）”时：

css: YAHOO.widget.SimpleEditor.prototype._defaultCSS  + 'body { font-size:130%; background-color:red;color:white;}'

这足以让字体大小和编辑器背景改变为我想要的。

Yahoo.widget.Editor - 如何配置文本的字体大小

2 个答案: