Rails CSS - 单个生成的文本输入字段中的不同样式答案

【问题标题】：Rails CSS - different styles in a single generated text input fieldRails CSS - 单个生成的文本输入字段中的不同样式
【发布时间】：2016-02-07 00:31:43
【问题描述】：

我有一个使用简单表单的 rails 4 应用程序。

我有一个名为 :content 的表单输入字段。它是一个文本字段。

我希望能够对内容字段内文本的重要部分应用不同的样式，并以与文本不同的方式显示链接。

我尝试按如下方式制作 SCSS 项目：

.intpol1 {
    font-family: 'Roboto', sans-serif;
    color: black;
    font-size: 36px;
    text-align:left;
    line-height: 2; 

}


.intpol2 {
    font-family: 'Roboto', sans-serif;
    color: black;
    font-size: 26px;
    text-align:left;
    line-height: 1.5;   
}

.intpol3 {
    font-family: 'Roboto', sans-serif;
    color: black;
    font-size: 16px;
    text-align:left;
}

.intpollink {
    font-family: 'Roboto', sans-serif;
    color: black;
    font-size: 16px;
    text-align:left;
    color: #E50851;
}

然后在我的表单中，我尝试如下应用它们：

<div class="intpol1"> Test</div> <div class="intpol3"> Test3</div> <div class="intpol2"> Test2</div> <div class="intpollink"> Testlink</div>

我希望实现的是 CSS 样式将应用于文本字段，而不是在 html 输出中呈现 div 标签。

有没有办法制作表单输入字段，以便在表单内容的各个部分上使用 CSS？

【问题讨论】：

标签： css ruby-on-rails simple-form

【解决方案1】：

很遗憾，这是不可能的。您不能在<input> 中放置任何子元素。要实现这样的效果，您需要使用多个 <input> 元素，并为每个元素设置样式。

【讨论】：