Как убрать стиль

Добавление и удаление стилей в коллекции экспресс-стилей

В Microsoft Office Word стили — это наборы параметров форматирования для повторного применения к тексту. Предположим, например, что заголовки в документе должны отображаться полужирным шрифтом, определенным цветом и размером шрифта. Хотя параметры форматирования можно настроить вручную для каждого из них, гораздо проще использовать стиль, одновременно применяющий все эти параметры.

Вы можете быстро и легко применить определенный стиль из коллекции «Стили» на вкладке «Главная». Вы также можете управлять содержимым коллекции, добавляя новые или другие популярные стили и удаляя те, которые вам не нужны.

Создание стиля для коллекции «Стили»

Часто используемые стили можно хранить в коллекции «Стили» на вкладке «Главная» для удобства использования. Вы можете в любое время создать новый стиль и добавить его в галерею.

Дополнительные параметры (СТРЕЛКА ВНИЗ)

Вы можете выбрать текст, который вы хотите отформать как новый стиль. Например, может быть нужно, чтобы текст, содержащий определенные сведения о вашей компании, всегда был полужирным и красным.
На мини-панели инструментов, которая отображается над выделением, укажите нужное форматирование. Например, можно щелкнуть Полужирный иКрасный .
Выобрав форматированный текст, щелкните стрелку Дополнительные в правом нижнем углу коллекции «Стили» и выберите создать стиль. Появится диалоговое окно Создание стиля из форматирования.
Придай стилю имя, например Бизнес-факт,и нажмите кнопку ОК. Созданный стиль появится в коллекции «Стили» с именем, которое вы ему предоставили, и сможете применить его, когда текст будет полужирным и красным.

Перемещение стиля в галерею «Стили»

Вы можете переместить любой существующий стиль в коллекции «Стили» для удобного доступа.

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

Изменение стиля в коллекции «Стили»

Вы можете изменить определение стилей, доступных для документа. Предположим, например, что стиль «Заголовок 1» должен быть более выделяем. Вы можете использовать крупный или более крупный шрифт, а также добавить больше места над заголовком и под заголовком.

На вкладке Главная в группе Стили щелкните правой кнопкой мыши стиль коллекции, который вы хотите изменить, и выберитеизменить .
В диалоговом окне Изменение стиля измените стиль любым способом, а затем нажмите кнопку ОК. Например, в области Форматированиещелкните стрелку рядом с полем Цвет и выберите новый цвет шрифта. Все экземпляры стиля автоматически обновляются во всем документе.

Удаление стиля из коллекции «Стили»

На вкладке Главная в группе Стили щелкните правой кнопкой мыши стиль, который вы хотите удалить из коллекции.
В меню выберите пункт Удалить из коллекции стилей.

Примечание: При удалении стиля из коллекции он не удаляется из записей, которые отображаются в области задач Стили. В области задач Стили перечислены все стили документа.

Помимо использования коллекции «Быстрые стили» на вкладке «Главная» для простого применения форматирования к тексту, вы также можете выбрать целый набор стилей, которые вместе создают документы, предназначенные для определенной цели. Например, можно использовать один набор быстрых стилей для отчетов. Оно может включать стили заголовков, абстрактное название, несколько уровней заголовков и текста. Все цвета и форматы стилей в одном наборе стилей предназначены для создания привлекательных и уместных документов.

Создание стиля для коллекции «Быстрые стили»

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

Вы можете выбрать текст, который вы хотите отформать как новый стиль. Например, может быть нужно, чтобы текст, содержащий определенные сведения о вашей компании, всегда был полужирным и красным.
На мини-панели инструментов, которая отображается над выделением, укажите нужное форматирование. Например, можно щелкнуть Полужирный иКрасный .
Щелкните правой кнопкой мыши нужный пункт, найдите стилии выберите пункт Сохранить выделение как новый быстрый стиль.
Придай стилю имя, например Бизнес-факт,и нажмите кнопку ОК. Созданный стиль появится в коллекции «Быстрые стили» с его именем и будет готов к применении, когда текст будет полужирным и красным.

Перемещение стиля в галерею «Быстрые стили»

Вы можете переместить любой существующий стиль в галерею «Быстрые стили» для удобного доступа.

На вкладке Главная нажмите кнопку запуска диалогового окна Стили и выберите параметры.
В области Выбор стилей для показавыберите все стили. Все стили отображаются в области задач Стили.
Вы можете выбрать текст в документе, а затем выбрать стиль в области задач Стили. Стиль появится в коллекции «Быстрые стили».

Изменение стиля в наборе быстрых стилей

Вы можете изменить определение стилей в наборе быстрых стилей. Предположим, например, что стиль «Заголовок 1» должен быть более выделяем. Вы можете использовать крупный или более крупный шрифт, а также добавить больше места над заголовком и под заголовком.

На вкладке Главная в группе Стили щелкните правой кнопкой мыши стиль в коллекции «Быстрые стили», который вы хотите изменить, и выберитеизменить .
В диалоговом окне Изменение стиля измените стиль любым способом, а затем нажмите кнопку ОК. Например, в области Форматированиещелкните стрелку рядом с полем Цвет и выберите новый цвет шрифта. Все экземпляры стиля автоматически обновляются во всем документе.

Сохранение стилей в качестве нового набора быстрых стилей

После изменения набора быстрых стилей вы можете сохранить новый набор стилей в списке наборов стилей, которые можно выбрать.

Примечание: Вы также можете изменить цвета или шрифты, используемые в наборе быстрых стилей, щелкнув Изменить стили в группе Стили и щелкнув Цвета или Шрифты.

Удаление стиля из коллекции «Быстрые стили»

На вкладке Главная в группе Стили щелкните правой кнопкой мыши стиль, который вы хотите удалить из коллекции.
В меню быстрого доступа выберите пункт Удалить из коллекции быстрых стилей.

Примечание: При удалении стиля из коллекции «Быстрые стили» он не удаляется из записей, которые отображаются в области задач Стили. В области задач Стили перечислены все стили документа.

Удалить встроенные свойства CSS из элемента с помощью JavaScript/jQuery

В этом посте мы обсудим, как удалить встроенные свойства CSS из элемента с помощью JavaScript и jQuery.

Свойство CSS могло быть применено непосредственно с помощью HTML. style атрибут или с помощью jQuery .css() метод или прямое манипулирование DOM свойством стиля. Обратите внимание, что решение не удаляет стили, примененные с классом CSS или с HTML. элемент.

1. Использование jQuery

Стандартный метод установки атрибута CSS — с помощью .css() метод, который изменяет элемент style имущество. Если вы установите значение свойства стиля в пустую строку, оно удалит свойство из этого элемента. Однако это оставляет пустое свойство стиля в DOM.

.removeProperty()

Это незавершённая статья. Вы можете помочь её закончить! Почитайте о том, как контрибьютить в Доку.

Открыть/закрыть навигацию по статье

Обновлено 8 марта 2023

Кратко

Скопировать ссылку «Кратко» Скопировано

Метод remove Property ( ) удаляет указанное CSS-свойство у элемента и возвращает значение этого свойства.

Пример

Скопировать ссылку «Пример» Скопировано

Превращаем круг в квадрат.

 const circle = document.getElementById('round'); function turnToSquare ()  circle.style.removeProperty('border-radius');> const circle = document.getElementById('round'); function turnToSquare ()  circle.style.removeProperty('border-radius'); >

Как пишется

Скопировать ссылку «Как пишется» Скопировано

remove Property ( ) принимает один аргумент – строку с именем свойства. Пишем названия также, как в CSS: background — color , а не background Color .

 vampire.style.removeProperty('box-shadow'); vampire.style.removeProperty('box-shadow');

Как понять

Скопировать ссылку «Как понять» Скопировано

Метод remove Property ( ) позволяет удалить отдельное CSS-свойство элемента.

Чтобы управлять отображением элемента лучше использовать чистый CSS, устанавливая элементу классы-модификаторы с нужным набором стилей.

Но иногда полезно программно изменять CSS-свойства. Например, если в нужный момент установить элементу свойство will — change , а потом удалить его, то можно получить выигрыш по производительности.

Если с помощью метода remove Property ( ) не выходит удалить свойство и вы получаете ошибку «NoModificationAllowedError» – значит элемент или его свойство находится в режиме read — only .

Есть альтернатива – можно использовать style и указать свойству значение «null». Названия в этом случае пишем через camelCase:

 vampire.style.boxShadow = null; vampire.style.boxShadow = null;

Сбросить / удалить стили CSS только для элемента

Я уверен, что это, должно быть, было упомянуто/задано раньше, но искали возраст без везения, моя терминология должна быть неправильной! Я смутно помню твиты, которые я видел некоторое время назад, которые предположили, что существует правило css, которое удалит любые стили, ранее установленные в таблице стилей для определенного элемента. Хорошим примером использования может быть сайт Mobile-first RWD, где большая часть стиля, используемого для определенного элемента в представлениях с малым экраном, требует «сброса» или удаления для того же элемента в представлении рабочего стола. Правило css, которое может достичь чего-то вроде:

.element

Пример использования:

/* mobile first */ .element < margin: 0 10; transform: translate3d(0, 0, 0); z-index: 50; display: block; etc.. etc.. >@media only screen and (min-width: 980px) < .element < all: none; >>

Таким образом, мы могли бы быстро удалить или переустановить стиль, не объявляя каждое свойство. Имеет смысл?

matt_50 09 апр. 2013, в 12:54
Поделиться

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

CBroe 09 апр. 2013, в 11:53
Способ сделать это состоит в том, чтобы ограничить это в первую очередь медиа-запросами
Kevin Lynch 09 апр. 2013, в 11:58
Milche Patern 09 апр. 2013, в 13:06
Спасибо за все предложения — я думаю, что я мечтал об этом волшебном правиле сброса!
matt_50 09 апр. 2013, в 18:31

Существует свойство называется all , что предлагается для сброса всех свойств CSS для данного элемента в некоторые CSS шириной значений — значение , которое вы хотите использовать будет unset с unset , который сбрасывает свойство либо унаследованное значение , если он наследует по умолчанию или иначе, его начальное значение. Нет слов о реализации, но приятно знать, что кто-то об этом думал.

BoltClock♦ 30 апр. 2014, в 04:58
Вот твит 2015 года на этот счет: twitter.com/LeaVerou/status/577390241763467264
Dan Dascalescu 06 сен. 2015, в 07:30
Есть забавная опечатка «Eaxmple Использование:», улыбаясь мне.
Milche Patern 16 окт. 2015, в 03:31
all: revert сделаю. Смотри мой ответ. @CBroe Да, такая вещь существует сейчас.
Asim K T 28 март 2016, в 06:06
Показать ещё 6 комментариев
Поделиться:

14 ответов

Лучший ответ

CSS3 ключевое слово initial устанавливает свойство CSS3 к исходному значению, как определено в спецификации. initial ключевое слово имеет широкую поддержку браузера, за исключением семейств IE и Opera Mini.

Поскольку IE отсутствие поддержки может вызвать проблему, вот некоторые из способов сброса некоторых свойств CSS на их начальные значения:

.reset-this < animation : none; animation-delay : 0; animation-direction : normal; animation-duration : 0; animation-fill-mode : none; animation-iteration-count : 1; animation-name : none; animation-play-state : running; animation-timing-function : ease; backface-visibility : visible; background : 0; background-attachment : scroll; background-clip : border-box; background-color : transparent; background-image : none; background-origin : padding-box; background-position : 0 0; background-position-x : 0; background-position-y : 0; background-repeat : repeat; background-size : auto auto; border : 0; border-style : none; border-width : medium; border-color : inherit; border-bottom : 0; border-bottom-color : inherit; border-bottom-left-radius : 0; border-bottom-right-radius : 0; border-bottom-style : none; border-bottom-width : medium; border-collapse : separate; border-image : none; border-left : 0; border-left-color : inherit; border-left-style : none; border-left-width : medium; border-radius : 0; border-right : 0; border-right-color : inherit; border-right-style : none; border-right-width : medium; border-spacing : 0; border-top : 0; border-top-color : inherit; border-top-left-radius : 0; border-top-right-radius : 0; border-top-style : none; border-top-width : medium; bottom : auto; box-shadow : none; box-sizing : content-box; caption-side : top; clear : none; clip : auto; color : inherit; columns : auto; column-count : auto; column-fill : balance; column-gap : normal; column-rule : medium none currentColor; column-rule-color : currentColor; column-rule-style : none; column-rule-width : none; column-span : 1; column-width : auto; content : normal; counter-increment : none; counter-reset : none; cursor : auto; direction : ltr; display : inline; empty-cells : show; float : none; font : normal; font-family : inherit; font-size : medium; font-style : normal; font-variant : normal; font-weight : normal; height : auto; hyphens : none; left : auto; letter-spacing : normal; line-height : normal; list-style : none; list-style-image : none; list-style-position : outside; list-style-type : disc; margin : 0; margin-bottom : 0; margin-left : 0; margin-right : 0; margin-top : 0; max-height : none; max-width : none; min-height : 0; min-width : 0; opacity : 1; orphans : 0; outline : 0; outline-color : invert; outline-style : none; outline-width : medium; overflow : visible; overflow-x : visible; overflow-y : visible; padding : 0; padding-bottom : 0; padding-left : 0; padding-right : 0; padding-top : 0; page-break-after : auto; page-break-before : auto; page-break-inside : auto; perspective : none; perspective-origin : 50% 50%; position : static; /* May need to alter quotes for different locales (e.g fr) */ quotes : '\201C' '\201D' '\2018' '\2019'; right : auto; tab-size : 8; table-layout : auto; text-align : inherit; text-align-last : auto; text-decoration : none; text-decoration-color : inherit; text-decoration-line : none; text-decoration-style : solid; text-indent : 0; text-shadow : none; text-transform : none; top : auto; transform : none; transform-style : flat; transition : none; transition-delay : 0s; transition-duration : 0s; transition-property : none; transition-timing-function : ease; unicode-bidi : normal; vertical-align : baseline; visibility : visible; white-space : normal; widows : 0; width : auto; word-spacing : normal; z-index : auto; /* basic modern patch */ all: initial; all: unset; >/* basic modern patch */ #reset-this-root < all: initial; * < all: unset; >>

Релевантный github-репо с декабрем 2017 года более убедительный список
связанные с
Относится к MDN
Связанные спецификации W3C

Как упоминалось в комментарии пользователя @user566245:

это верно в принципе, но индивидуальный пробег может отличаться. Например, некоторые элементы, такие как textarea по умолчанию, имеют границу, применяя этот сброс, они уменьшат границы textarea.

[POST EDIT FEB 4, ’17] Приобретен для того, чтобы стать современной нормой, пользователь Joost

#reset-this-parent < all: initial; * < all: unset; >>

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

Это может быть полезно для корневого элемента «виджета», включенного в страницу, который не хочет наследовать стили внешней страницы. Обратите внимание, однако, что любой стиль «по умолчанию», применяемый к этому элементу (например, например: отображение: блок из таблицы стилей UA на элементах блока, например), также будет удален.

Никто не думал о другом, кроме css, для сброса css? Да?

getElementsByTagName («*») вернет все элементы из DOM. Затем вы можете установить стили для каждого элемента в коллекции:

ответил 9 февраля 13 в 20:15 от VisioN

var allElements = document.getElementsByTagName("*"); for (var i = 0, len = allElements.length; i < len; i++) < var element = allElements[i]; // element.style.border = . >

Со всем этим сказано; я не думаю, что сброс css является чем-то выполнимым, если мы не закончим только с одним веб-браузером. Если в конце «браузер» будет установлен «по умолчанию».

Для сравнения здесь приведен список значений Firefox 40.0 для где font-style: oblique запуск DOM-операции.

align-content: unset; align-items: unset; align-self: unset; animation: unset; appearance: unset; backface-visibility: unset; background-blend-mode: unset; background: unset; binding: unset; block-size: unset; border-block-end: unset; border-block-start: unset; border-collapse: unset; border-inline-end: unset; border-inline-start: unset; border-radius: unset; border-spacing: unset; border: unset; bottom: unset; box-align: unset; box-decoration-break: unset; box-direction: unset; box-flex: unset; box-ordinal-group: unset; box-orient: unset; box-pack: unset; box-shadow: unset; box-sizing: unset; caption-side: unset; clear: unset; clip-path: unset; clip-rule: unset; clip: unset; color-adjust: unset; color-interpolation-filters: unset; color-interpolation: unset; color: unset; column-fill: unset; column-gap: unset; column-rule: unset; columns: unset; content: unset; control-character-visibility: unset; counter-increment: unset; counter-reset: unset; cursor: unset; display: unset; dominant-baseline: unset; empty-cells: unset; fill-opacity: unset; fill-rule: unset; fill: unset; filter: unset; flex-flow: unset; flex: unset; float-edge: unset; float: unset; flood-color: unset; flood-opacity: unset; font-family: unset; font-feature-settings: unset; font-kerning: unset; font-language-override: unset; font-size-adjust: unset; font-size: unset; font-stretch: unset; font-style: oblique; font-synthesis: unset; font-variant: unset; font-weight: unset; font: ; force-broken-image-icon: unset; height: unset; hyphens: unset; image-orientation: unset; image-region: unset; image-rendering: unset; ime-mode: unset; inline-size: unset; isolation: unset; justify-content: unset; justify-items: unset; justify-self: unset; left: unset; letter-spacing: unset; lighting-color: unset; line-height: unset; list-style: unset; margin-block-end: unset; margin-block-start: unset; margin-inline-end: unset; margin-inline-start: unset; margin: unset; marker-offset: unset; marker: unset; mask-type: unset; mask: unset; max-block-size: unset; max-height: unset; max-inline-size: unset; max-width: unset; min-block-size: unset; min-height: unset; min-inline-size: unset; min-width: unset; mix-blend-mode: unset; object-fit: unset; object-position: unset; offset-block-end: unset; offset-block-start: unset; offset-inline-end: unset; offset-inline-start: unset; opacity: unset; order: unset; orient: unset; outline-offset: unset; outline-radius: unset; outline: unset; overflow: unset; padding-block-end: unset; padding-block-start: unset; padding-inline-end: unset; padding-inline-start: unset; padding: unset; page-break-after: unset; page-break-before: unset; page-break-inside: unset; paint-order: unset; perspective-origin: unset; perspective: unset; pointer-events: unset; position: unset; quotes: unset; resize: unset; right: unset; ruby-align: unset; ruby-position: unset; scroll-behavior: unset; scroll-snap-coordinate: unset; scroll-snap-destination: unset; scroll-snap-points-x: unset; scroll-snap-points-y: unset; scroll-snap-type: unset; shape-rendering: unset; stack-sizing: unset; stop-color: unset; stop-opacity: unset; stroke-dasharray: unset; stroke-dashoffset: unset; stroke-linecap: unset; stroke-linejoin: unset; stroke-miterlimit: unset; stroke-opacity: unset; stroke-width: unset; stroke: unset; tab-size: unset; table-layout: unset; text-align-last: unset; text-align: unset; text-anchor: unset; text-combine-upright: unset; text-decoration: unset; text-emphasis-position: unset; text-emphasis: unset; text-indent: unset; text-orientation: unset; text-overflow: unset; text-rendering: unset; text-shadow: unset; text-size-adjust: unset; text-transform: unset; top: unset; transform-origin: unset; transform-style: unset; transform: unset; transition: unset; user-focus: unset; user-input: unset; user-modify: unset; user-select: unset; vector-effect: unset; vertical-align: unset; visibility: unset; white-space: unset; width: unset; will-change: unset; window-dragging: unset; word-break: unset; word-spacing: unset; word-wrap: unset; writing-mode: unset; z-index: unset;

Milche Patern 09 апр. 2013, в 14:58
Поделиться

Я думаю, что это в принципе правильно, но индивидуальный пробег может отличаться. Например, некоторые элементы, такие как textarea, по умолчанию имеют границу, применение этого сброса сделает границу этих textarea меньше. Так что это не настоящий сброс. Я закончил тем, что использовал это только для определенных свойств, о которых я заботился. Вы также можете комбинировать его с селектором * для сброса всех элементов или сброса всех элементов внутри определенного элемента.

user566245 18 фев. 2014, в 11:13

@ user566245 Применение этого с * селектором убьет ваш браузер и котенка. Это НЕ настоящий сброс. Истинного сброса просто не существует.

Milche Patern 18 фев. 2014, в 16:48

@Milkywayspatterns LOL, вы, вероятно, правы. Для меня я взял только те атрибуты, которые хотел сбросить, и применил к «div # theid *». Надеюсь, это никого не убьет, котенок 🙂

user566245 19 фев. 2014, в 02:00

дисплей должен быть установлен на нормальный, а не встроенный. Поскольку некоторые элементы, такие как div, h1 и т. Д., Являются блочными элементами по умолчанию.

Jeremy 20 март 2014, в 16:36
@ Джереми хум дисплей: нормально? Ты имеешь в виду наследственное ??
Milche Patern 25 март 2014, в 15:30

@ Джереми: Вы думаете о настройках браузера по умолчанию, которые различаются для разных элементов. Начальное значение отображения всегда встроено независимо от того, к какому элементу оно применяется.

BoltClock♦ 30 апр. 2014, в 04:52

ctrl+F (найти / заменить) -> ввести «:» (пробел: пробел) -> заменить на: «:» (: пробел) -> заменить все . Другими словами, было бы хорошо для пользователей, которые могли бы использовать это, чтобы не было пробелов перед двоеточием, которое является более стандартным форматированием для CSS. Не раскалывать волосы или что-то еще.

Yes Barry 05 июль 2014, в 07:11

@mmmshuddup Спасибо за совет. Если вы посмотрите на оригинальный ответ, я изменил его как CSS. Что касается сжатия, то это ответ, а не патч копирования-вставки. Не так ли?

Milche Patern 07 июль 2014, в 13:29
Вы можете использовать свойство all , которое поддерживается всеми современными браузерами .
Dan Dascalescu 06 сен. 2015, в 07:31

@DanDascalescu будьте осторожны со вставленным копией заявлением от LeaVerou .. ЭТО НЕ поддерживается всеми современными браузерами. Вернитесь на сайт developer.mozilla.org/en-US/docs/Web/CSS/all и ознакомьтесь с содержанием «Совместимость браузера» внизу страницы. Смотрите: caniuse.com/#search=all

Milche Patern 08 сен. 2015, в 14:59
Я думаю, вам не нужно устанавливать margin-top когда вы уже установили margin и т. Д.
KeepMove 24 сен. 2015, в 08:46

@SoursopTree Вы правы в отношении сокращения, удваивающего определенный атрибут. Моя цель состояла в том, чтобы сделать его исчерпывающим и полным для понимания, а не для блока кода копирования-вставки.