html - 为什么不使用相同颜色的 html/css

标签 html css

为什么附近的按钮背景颜色不是灰色,而是白色。和鞋面一样的灰色怎么办?我在哪里可以找到与我制作的类似的联系表格。抱歉我的英语不好。

.row1:before,
.row1:after{
  display: table;
  content: " ";
}
.row1:after,{
  clear: both;
}
.row1 {
  margin-right: -15px;
  margin-left: -15px;
  background-color: #f0f0f0;
}
.Contact_form{
  width: 60%;
  float: none;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  min-height: 1px;
}
._input{
  display: block;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.38;
  margin-top: 5px;
  color: #000000;
  font-size: 13px;
  padding: 10px;
}
._input-long{
  height: 110px;
  padding-top: 5px;
}
._input-1 {
  height: 40px;
}
._button {
  display: block;
  float: left;
  width: 23.2333333333%;
  height: 56px;
  margin: 10px 0 0 57.53385%;
  background-color: #2979ff;
  line-height: 1.38;
  text-align: center;
  color: #ffffff;
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #000;
    margin: 1em 0;
    padding: 0;
}
.Contact_text{
  margin-left: auto;
  margin-right: auto;
  width: 10%;
  float: none;
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
<div class="container-fluid">
		<div class="row1">
			<div class="Contact_text">
			<p>Palikyte mums =inut4</p>
			<hr></hr> 
			</div>
			<div class=".Contact_form"> 
				<input id="name" class="_input _input-1 js-name" name="J8s7 vardas" placeholder="J8s7 vardas" type="text">
				<input id="connection" class="_input _input-1 js-contact" name="mail&phone" placeholder="Tel. nr." type="text">
				<input class="_input-long _input" name="+inute" placeholder="asdasdsad" type="text">
				<button type="submit" id="send" class="_button js-send_info">Si7sti =inut3</button>
			</div>
		</div>
	</div>

最佳答案

你的 <button>是 float 的,将其从正常的页面流中取出。它的 parent ,.Contact_form不再拉伸(stretch)以适应它。您可以使用 overflow清除任何 float 的样式。

还有 class属性采用没有句点 ( . ) 的类。

.row1:before,
.row1:after{
  display: table;
  content: " ";
}
.row1:after,{
  clear: both;
}
.row1 {
  margin-right: -15px;
  margin-left: -15px;
  background-color: #f0f0f0;
}
.Contact_form{
  overflow: hidden;
  width: 60%;
  float: none;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  min-height: 1px;
}
._input{
  display: block;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.38;
  margin-top: 5px;
  color: #000000;
  font-size: 13px;
  padding: 10px;
}
._input-long{
  height: 110px;
  padding-top: 5px;
}
._input-1 {
  height: 40px;
}
._button {
  display: block;
  float: left;
  width: 23.2333333333%;
  height: 56px;
  margin: 10px 0 0 57.53385%;
  background-color: #2979ff;
  line-height: 1.38;
  text-align: center;
  color: #ffffff;
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #000;
    margin: 1em 0;
    padding: 0;
}
.Contact_text{
  margin-left: auto;
  margin-right: auto;
  width: 10%;
  float: none;
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
<div class="container-fluid">
    <div class="row1">
        <div class="Contact_text">
            <p>Palikyte mums =inut4</p>
            <hr></hr> 
        </div>
        <div class="Contact_form"> 
            <input id="name" class="_input _input-1 js-name" name="J8s7 vardas" placeholder="J8s7 vardas" type="text">
            <input id="connection" class="_input _input-1 js-contact" name="mail&phone" placeholder="Tel. nr." type="text">
            <input class="_input-long _input" name="+inute" placeholder="asdasdsad" type="text">
            <button type="submit" id="send" class="_button js-send_info">Si7sti =inut3</button>
        </div>
    </div>
</div>

关于html - 为什么不使用相同颜色的 html/css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28032632/

相关文章:

javascript - 后台附件 : fixed not working in jquery mobile phonegap

html - 仅包含 html/css 的多个可折叠列表

html - 如何在 iOS Swift 3 中从 url 解析 HTML 后获取表数据

javascript - 在网站一侧 float 图像代码?

php - 如果HTML maxlength 是110,为什么我可以输入114 个字符?

html - Javascript/HTML 横幅不工作

html - 一个 html 按钮中的两种不同渐变

css - 为什么我无法垂直对齐该文本?

html - 将输入的标签包装在超链接 anchor 标记中

css - NavBar 和 Search Bar 在同一行