Html 基础污染CSS环境吗?
我想使textfield只具有底部边框 ths cssHtml 基础污染CSS环境吗?,html,css,zurb-foundation,Html,Css,Zurb Foundation,我想使textfield只具有底部边框 ths css .input { border: 0; outline: 0; background: transparent; border-bottom: 2px solid black; width: 20px; } <input type="text" name="art-title" class="input" maxlength="14" autofocus placeholder="T
.input {
border: 0;
outline: 0;
background: transparent;
border-bottom: 2px solid black;
width: 20px;
}
<input type="text" name="art-title" class="input" maxlength="14" autofocus placeholder="Title"/>
导入基础CSS文件时,只有底部BordE的文本字段不起作用。
您的问题可能与CSS专用性有关。基金会的样式比你的样式更具体,或者你在基金会的样式之前包含你的样式。我尝试过,但没有成功。你需要提供更多代码。我们不知道你是如何应用你的CSS的,以什么顺序等说,我尝试了,但没有工作。对我们没什么帮助。我们无法核实你做了什么。请在包含CSS的HTML中包含所有CSS。您甚至可能想要创建一个jsFiddle jsFiddle.net。谢谢,我更新了这个问题,我很确定您遇到了一个特殊性问题。请将此JSFIDLE作为示例。我编写的.title输入类将输入的高度设置为100px。正如你所看到的,它不是100px。即使该类是在基础之后定义的。Min。CSS被包含在页面中,Puffo.min。CSS有一个比我定义的更具体的CSS选择器,所以输入的高度没有改变到100px。您可以将其选择器输入[type=text]与选择器进行比较。此处的标题输入:。 <html>
<head>
<title>Editor</title>
<link rel="stylesheet" href="/styles/editor.css" />
<link rel="stylesheet" href="/styles/lib/foundation.min.css">
</head>
<body>
<form>
<input type="text" name="art-title" class="art-input" maxlength="14" autofocus placeholder="Title"/>
</form>
<div class="art-container">
<div class="form">
<input type="text" name="art-title" class="title-input" maxlength="14" autofocus placeholder="Title"/>
<div class="cover-img">
<input type="file" name="userPhoto" id="file" placeholder="Cover"/>
<input type="submit" value="Upload" id="cover-img-submit">
</div>
</div>
<div id="editor">
<p>sdesdssssssssssssssssss</p>
</div>
</div>
<script src="/scripts/lib/jquery.js"></script>
<script src="/scripts/lib/aloha.min.js"></script>
<script src="/scripts/editor.js"></script>
</body>
</html>
.art-container {
width: 57rem;
margin-left: auto;
margin-right: auto;
}
.title-input {
background-color: transparent;
border: none;
border-bottom: 2px solid #000000;
outline: none;
padding-bottom: 5px;
width: 100%;
text-align: center;
font-size: 300%;
}