Question

我想更改文本输入字段的UI。

这是当前 CSS 的样子：

textarea.form-textarea-user-name {
    width:              110px;
    height:             80px;
    text-transform:     uppercase;
    resize:             none;
    font-size:          18px;
}

这就是 SCRIPT 的样子：

function getSelectionInformationHtml(selectionId, userName, selectionText)
{
    var selectionIdAsId = selectionId.replace(/^[^a-z]+|[^\w]+/gi, '_');
    var text = '<form name="selection-update-' + selectionIdAsId + '" onsubmit="sendSelectionInformation(\'' + selectionId + '\'); return false;">';
    text += '<span class="selectionId">' + selectionId.substring(0, selectionId.lastIndexOf(" ")) + ':</span> <textarea class="form-textarea-user-name" rows="1" cols="20" placeholder="your name">' + userName + '</textarea><textarea class="form-textarea-selection-text" rows="1" cols="50" placeholder="the new message">' + selectionText + '</textarea><button type="submit">Save</button>';
    text += '</form>';
    return text;
}

这就是我希望新文本输入看起来的方式：

https://codepen.io/PRtheRose/pen/BNgEJo

我的问题：我在何处以及如何将此HTML放入我的脚本

<div class="container">

  <div class="demo-flex-spacer"></div>

  <div class="webflow-style-input">
    <input class="" type="email" placeholder="What's your email?"></input>
    <button type="submit"><i class="icon ion-android-arrow-forward"></i></button>
  </div>

  <div class="demo-flex-spacer"></div>
  <h1 class="demo">Webflow-style input</h1>
  <a class="demo" href="https://webflow.com/cms" title="Webflow CMS">https://webflow.com/cms</a>

</div>

更改文本输入UI

0 个答案: