как стилизовать конкретный элемент типа ввода без влияния на другие - PullRequest
Новая
       30

как стилизовать конкретный элемент типа ввода без влияния на другие

0 голосов
/ 05 мая 2018

У меня проблема с выбором определенного элемента входного файла в html с помощью селектора.

Как стилизовать определенный элемент типа ввода без влияния на другие

1 Ответ

0 голосов
/ 05 мая 2018

Вы можете стилизовать определенный тип элемента ввода ниже 1) Примените класс или идентификатор к элементу ввода и напишите стили для этого класса или идентификатора

HTML 

<input class="custom-file" type="file"/>

CSS: 

.custom-file {
  border: 1px solid red;
}

2) Или Вы можете указать сам тип ввода в общем, как показано ниже:

HTML 

<input type="file"/>

CSS: 

input[type="file"] {
  border: 1px solid red;
}

Это будет применять CSS только для файла типа ввода, а не для других типов ввода, таких как текст и т. Д. Это добавит рамку красного цвета ко всем тегам ввода на странице с типом файла.

3) Или, если имеется более одного входного файла, попробуйте выполнить таргетинг с помощью селектора nth-child в css 

**HTML**

 <input class="custom-file" type="file"/>
 <input class="custom-file" type="file"/>
 <input class="custom-file" type="file"/>

**CSS:** 
input[type="file"]:nth-child(2) {
    border: 1px solid red;
}

Это добавит границу только ко второму экземпляру файла типа ввода.

...