Как я могу обнулить свойство css?

109

В основном у меня на странице два внешних CSS.

Первый Main.cssсодержит все правила стиля, но у меня нет к нему доступа, и поэтому я не могу его изменить. У меня есть доступ ко второму файлу Template.css, поэтому мне нужно переопределить Main.cssзначения в template.css.

Это просто, для чего мне нужно изменить значение, но как полностью удалить свойство?

Например, у класса .c1есть height: 40px;, как мне избавиться от этого свойства высоты?

Bluemagica
источник

Ответы:

175

Вам необходимо сбросить каждое отдельное свойство до значения по умолчанию. Это не здорово, но это единственный способ, учитывая информацию, которую вы нам предоставили.

В вашем примере вы бы сделали:

.c1 {
    height: auto;
}

Вы должны искать здесь каждое свойство:

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

К примеру,height :

Начальное значение : auto

Другой примерmax-height :

Начальное значение : none


В 2017 году появился другой способ - unsetключевое слово:

.c1 {
    height: unset;
}

Некоторая документация: https://developer.mozilla.org/en-US/docs/Web/CSS/unset

Ключевое слово CSS unset - это комбинация начального и наследуемого ключевых слов. Как и эти два других ключевых слова CSS, его можно применить к любому свойству CSS, включая сокращенное обозначение CSS all. Это ключевое слово сбрасывает свойство до его унаследованного значения, если оно наследуется от своего родителя, или до его начального значения, если нет. Другими словами, он ведет себя как ключевое слово inherit в первом случае и как ключевое слово initial во втором случае.

Поддержка браузера хорошая: http://caniuse.com/css-unset-value

thirtydot
источник
3
+1 за хороший ответ и ссылку. Я думаю, что ссылка изменилась на: developer.mozilla.org/en-US/docs/Web/CSS/Reference
Паоло
Установка значения на auto, похоже, не работает, если нет начального значения («начальное значение: нет»). Например, при выполнении "max-width: auto;" Я получаю ошибку несоответствия значения свойства. Что я должен делать?
user1779563
3
@ user1779563 Вы установили "none".
AndreKR
1
Я хотел бы поблагодарить @simhumileco за его ответ, который я бессовестно украл, поскольку мой ответ принят, и люди не могут прокручивать страницу вниз.
30dot 04
10
.c1 {
    height: unset;
}

unsetДобавлено в значение CSS3 также решает эту проблему , и это еще более универсальным , чем метод autoилиinitial потому , что он устанавливает для каждого CSS свойств его значение по умолчанию и дополнительно его значение по умолчанию behawior относительно его родителя.

Обратите внимание, что initialзначение нарушает вышеупомянутое поведение.

Из MDN :

Как и эти два других ключевых слова CSS, его можно применить к любому свойству CSS, включая сокращенное обозначение CSS all . Это ключевое слово сбрасывает свойство до его унаследованного значения, если оно наследуется от своего родителя, или до его начального значения, если нет.

simhumileco
источник
9

например, класс .c1 имеет высоту: 40 пикселей; как мне избавиться от этого свойства высоты?

К сожалению, вы не можете. В CSS нет заполнителя по умолчанию.

В этом случае вы должны сбросить свойство, используя

 height: auto;

как правильно указывает @Ben, в некоторых случаях inheritэто правильный путь, например, при сбросе цвета текста aэлемента (это свойство наследуется от родительского элемента):

a { color: inherit }
Пекка
источник
3
Я дам +1 к этому. Также существует значение «наследование». В некоторых контекстах, отличных от высоты, более уместно наследование.
Бен
1
@meo ты прав. (Связанный вопрос), который, кажется, означает, что есть свойства, которые нельзя сбросить до значений по умолчанию в IE ... как жаль,
Пекка
7

В initialCSS3 добавляется ключевое слово, позволяющее авторам явно указывать это начальное значение.

RonyK
источник
К вашему сведению: height:initial;похоже, не работает в IE9.
Крис Холленбек
так в чем разница между initialи autoи unset?.
ExillustX
2

Чтобы избавиться от свойства фиксированной высоты, вы можете установить для него значение по умолчанию:

height: auto;
Ричард Х
источник
2

Вам необходимо предоставить селектор с более высокой специфичностью, чем в Main.css. С помощью этого селектора установите значения свойств, которые вы хотите, по умолчанию, например

body .c1 {
    height: auto;
}

Не существует значения "по умолчанию", которое будет работать для всех свойств, вам нужно найти значение по умолчанию для каждого из них и использовать его.

Джон
источник
1

У меня была проблема, что даже когда я перезаписал «высоту» на «неустановленный» или «начальный», это вело себя иначе, чем когда я удалил предыдущую настройку.

Оказалось, что мне тоже нужно удалить свойство min-height!

height: unset;
min-height: none

Изменить: я тестировал IE 7, и он не распознает "не задано", поэтому "авто" работает лучше ".

Наталия Ксавье
источник