简体   繁体   English

如何在html文本输入标签中使用上标?

[英]How to use superscript in an html text input tag?

I've got a simple input tag (which I prettify using Bootstrap) in which I now want to place a superscript (to display "m 2 "). 我有一个简单的输入标签(我使用Bootstrap进行了美化),我现在想要放置一个上标(显示“m 2 ”)。 The problem is that when I do this: 问题是当我这样做时:

<input class="form-control" name="gla" placeholder="m<sup>2</sup>" type="text">

the placeholder literally shows this: m<sup>2</sup> 占位符字面上显示: m<sup>2</sup>

Does anybody know how I can properly display the superscript? 有谁知道我怎么能正确显示上标? All tips are welcome! 欢迎所有提示!

How about using HTML Entities 如何使用HTML实体

<input class="form-control" name="gla" placeholder="m&sup2;" type="text">

Yes it works 是的有效

You could just use the UTF-8 character for superscripted ². 您可以将UTF-8字符用于上标²。 Also be sure to set the charset of the document to UTF-8 . 另外一定要将文档的字符集设置为UTF-8

 <html> <head> <meta charset="UTF-8"> </head> <body> <input class="form-control" name="gla" placeholder="m²" type="text" /> </body> </html> 

Also this answer might be of help. 这个答案也许有帮助。

您应该能够将²字符直接插入html标记 - 它是ascii代码262 / octal 178.这应该安全地呈现,因为它只是ASCII而不是Unicode。

 <input type="text" placeholder="m²" /> 

Try this, You can use, 试试这个,你可以用,

HTML Entity (Named) &sup2; HTML实体(已命名) &sup2;

HTML Entity (Decimal) &#178; HTML实体(十进制) &#178;

HTML Entity (Hexadecimal) &#x00B2; HTML实体(十六进制) &#x00B2;

 <input class="form-control" name="gla"  placeholder="m&#178;" type="text">

Demo : http://jsfiddle.net/q8310f27/1/ 演示: http//jsfiddle.net/q8310f27/1/

Within an attribute value, you can use characters just like in document content (except for the quote character used as attribute value delimiter). 在属性值中,您可以像使用文档内容一样使用字符(除了用作属性值分隔符的引号字符)。 This means that you can write the superscript two character as such, or using a named character reference, or a numeric reference. 这意味着您可以将上标两个字符编写,或者使用命名字符引用或数字引用。 When using the character as such, you need to make sure that the character encoding is properly declared (corresponds to the actual encoding). 当使用这样的字符时,您需要确保正确声明字符编码(对应于实际编码)。

 <input class="form-control" name="gla" placeholder="m²" type="text"><br> <input class="form-control" name="gla" placeholder="m&sup2;" type="text"><br> <input class="form-control" name="gla" placeholder="m&#178;" type="text"><br> <input class="form-control" name="gla" placeholder="m&#xb2;" type="text"><br> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM