Как выбрать два разных типа ввода текста, который находится в div? - PullRequest
Новая
       7

Как выбрать два разных типа ввода текста, который находится в div?

0 голосов
/ 11 января 2019

У меня есть два разных ввода текста типа, и я хотел бы применить разные стили к каждому из них. Как бы я поступил так? 

div input[type=text] {
	background-color: #212121;
	border: none;
	color: white;
	padding: 1px 5px;
	text-align: right;
text-decoration: none;
display: inline-block;
font-size: 10px;
width: 86px;
height: 35px;
}

.contact-field {
	width: 33.33%; 
	display: inline-block;
	vertical-align: top;
}

.contact-field input {
	width: 90%;
	padding: 10px;
	border: 3px solid #dedede;
	outline: none;
	margin-bottom: 10px;
	transition: all .325s;
}
<div class="row">
  <div class="column">
    <input type="text" name="MAR 7" value="MAR 7">
	</div>
  <div class="column">
    <div class="caption">
    <h5>Ziggo Dome</h5>
    <h6>NIEUW-AMSTERDAM, NETHERLANDS</h6>
    </div>
	</div>

  <div class="main-container">
    <section class="contact-container"> 
      <form method="GET" action="#">
        <div class="contact-field">
        	  <input type="text" name="full-name" placeholder="Email Address" required/>
	</div>

Я явно новичок в этом. Я надеюсь, что вы можете мне помочь.

1 Ответ

0 голосов
/ 11 января 2019

В CSS, чтобы нацелиться на первый ввод, вы должны сделать что-то вроде этого - .row .column input[type="text"]

А второй вот так - .main-container .contact-container form contact-field input[type="text"]

Это позволит вам применять различные стили CSS к каждому из ваших входов, не пересекая их.

...