带有输入标签的自定义文本框

-1

我试图使用不同字体和透明背景的自定义文本框（输入），我发现了两篇关于如何编辑输入字体系列和使背景透明的文章。带有输入标签的自定义文本框

Is background-color:none valid CSS? Why doesn't <input> inherit the font from body?

但我想

HTML：

<div id='test' class='menuInput' style='background-color:blue;' onClick='alert("Test");'><input type="text"></div>

CSS：

input,.menuInput{ 
    margin-top:10px; 
    text-align:center; 
    font-size:35px; 
    margin:0px auto; 
    font-family:FixedSys; 
    padding-bottom:6px; 
    height:35px; 
    border:2px solid black; 
    width:400px; 
    background-color:transparent; 
    color:white; 
    margin-bottom:15px; 
}

但它不工作？背景颜色仍然是白色的，字体家族也没有改变

编辑：感谢您的答案，但它仍然不工作？我试过

.menuInput input[type="text"]{ 
    margin-top:10px; 
    text-align:center; 
    font-size:35px; 
    margin:0px auto; 
    font-family:FixedSys; 
    padding-bottom:6px; 
    height:35px; 
    border:2px solid black; 
    width:400px; 
    background-color:green; 
    color:white; 
    margin-bottom:15px; 
}

而且它还没有工作？

我敢肯定我有那种字体，因为我用它来做别的事情！

来源

2014-05-01 Victor Chen

不能重复发布该代码。 –

？你什么意思？ –

使用发布的HTML进行测试，并且发布的任一CSS片段都不会*重现文中描述的问题。发布者自己的评论作为答案表明，该问题不包含用于实际再现问题的足够信息。 –

尝试是这样的：

.menuInput input[type=text]{ 
background:rgba(255,255,255,.5); 
color:#000; 
font:12px bold ".."; 
}

来源

2014-05-01 05:34:16

jsFiddle

我删除您在HTML和检查透明度提到的样式，设置：

body{ 
    background-color: yellow; 
}

你的字体不是标准，我的想法是。请提供适当的路径。

来源

2014-05-01 05:34:23

适当的路径？ –

我的意思是使用'@ font-face'。更多信息：https：//developer.mozilla.org/en-US/docs/Web/CSS/@font-face或http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp –

-1

HTML

<div id='test' class='menuInput'> 
<input type="text" class="test1"/> 
</div>

CSS

.menuInput{ 
    background-color:yellow; 
} 

input.test1{ 
    margin-top:10px; 
    text-align:center; 
    font-size:35px; 
    margin:0px auto; 
    padding-bottom:6px; 
    height:35px; 
    border:2px solid black; 
    width:400px; 
    background-color:transparent; 
    color:red; 
    margin-bottom:15px; 
    font-family:Arial,Helvetica,sans-serif; 
}

来源

2014-05-01 05:47:35 user00000341

您输入文字的背景色是不是透明的，它是蓝色的，因为你给了“格”背景颜色蓝色重叠输入标签。

<div id='test' class='menuInput' style='background-color:blue;' onClick='alert("Test");'> 
    <input type="text"/> 
</div>

下面是正在工作的代码，它也接受font-family。可能有一些可能不被接受的字体家族。所以检查使用不同的字体家族。我已经使用“信使和Arial”，它正在接受第一个。

HTML: 
<div id='test' class='menuInput'> 
    <input type="text" /> 
</div> 

CSS: 
input,.menuInput{ 
    margin-top:10px; 
    text-align:center; 
    font-size:35px; 
    margin:0px auto; 
    font-family:Courier,Arial; 
    padding-bottom:6px; 
    height:35px; 
    border:2px solid black; 
    width:400px; 
    background-color:transparent; 
    color:black; 
    margin-bottom:15px; 
}

来源

2014-05-01 06:51:40 Reena

哇靠家伙，我很抱歉，但问题是，我从字面上只把DIV的.html和忘记了HTML头和身体标签

= _ =

总Noob-Out

来源

2014-05-01 23:14:45

带有输入标签的自定义文本框

回答

相关问题