Question

我无法编辑html代码，以下问题可能仅使用＆＃34; CSS＆＃34;码？如何将文本像占位符或其他内容一样添加到输入框？

这是输入文本框代码：

<input id="isn_email_address" type="text" name="user" size="40" maxlenth="90">

Answer 1

如果您不想使用占位符，显然还有其他方法。我不知道单独使用css是否可行。但是使用javascript和css你绝对可以做到这一点

Answer 2

您无法为所有浏览器使用CSS设置占位符。目前唯一支持它的浏览器是webkit。

使用jQuery即可实现此目的：工作 DEMO

注意：您需要最新的jquery库，可以从这里下载jQuery Library

试试这段代码： -

<head>

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

<script type = "text/javascript">

        $(document).ready(function()
        {

            $('#isn_email_address').attr("placeholder", "Type your text here");    

        });

    </script>



</head>

Answer 3

您可以使用一些伪元素，假设您不支持IE7及以下版本。

#isn_email_address {
   position: relative;
}
#isn_email_address:after { /*could use :before if you wanted too*/
   content: "Type your text here";
   display: block;
}
#isn_email_address:focus #isn_email_address:before {
   display: none;
}

您可能需要进行一些z-index调整，以确保您能够选择文本字段。另外，一些css *在这里留下：/ 我的价值 / *以确保它在正确的位置。

使用CSS在输入框中添加文本

3 个答案: