Знаете ли вы, что такое сброс CSS? Обычно его еще называют Reset CSS, который сбрасывает стиль браузера. В различных браузерах для селекторов CSS используются некоторые значения по умолчанию. Например, если для h1 не установлено значение, отображается определенный размер. Но не все браузеры используют одни и те же значения, поэтому CSS Reset используется для обеспечения единообразного поведения стиля веб-страницы в каждом браузере.
Если вы используете CSS, использовали ли вы когда-нибудь CSS Reset? Конечно, возможно, вы используете его, но не знаете, что используете. Например, вы можете использовать:
| * {заполнение: 0; поле: 0; граница: 0; |
Это также метод сброса CSS, который устанавливает отступы, поля и границы всех селекторов на 0. Это мощный метод, самый простой и безопасный, однако он также и самый ресурсоемкий. Для небольших веб-сайтов использование этого не приведет к большой трате ресурсов, но если это веб-сайт с очень большой структурой, такой как Yahoo, вам просто нужно выборочно сбросить CSS, чтобы уменьшить потери ресурсов. Ниже приведен код сброса CSS от Yahoo, который также является самым популярным методом сброса CSS. Метод, выбранный YUI:
| тело,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre, form,fieldset,input,textarea,p,blockquote,th,td { заполнение: 0; маржа: 0; } стол { граница-коллапс: коллапс; расстояние между границами: 0; } набор полей, img { граница: 0; } адрес, подпись, цитируйте, код, dfn, em,strong,th,var { вес шрифта: нормальный; стиль шрифта: нормальный; } ол,ул { стиль списка: нет; } подпись,th { выравнивание текста: по левому краю; } h1,h2,h3,h4,h5,h6 { вес шрифта: нормальный; размер шрифта: 100%; } д: до, д: после { содержание:"; } аббр, акроним { граница: 0; } |
Хорошо, я думаю, вы уже понимаете цель сброса CSS. Возможно, вы также можете написать свою собственную систему сброса CSS в соответствии со своими предпочтениями. В конце концов, потребности и привычки у всех разные. И вы можете обратиться к следующим:
Ateneu Популярный сброс CSS
| HTML, тело, div, диапазон, апплет, объект, iframe, h1, h2, h3, h4, h5, h6, p, цитата, pre, a, сокращение, акроним, адрес, большой, цитировать, код, del, dfn, em, шрифт, img, ins, kbd, q, s, samp, small, страйк, сильный, саб, суп, тт, вар, дл, дт, дд, ол, ул, ли, набор полей, форма, метка, легенда, таблица, подпись, tbody, tfoot, thead, tr, th, td { маржа: 0; заполнение: 0; граница: 0; контур: 0; шрифт-вес: наследовать; стиль шрифта: наследовать; размер шрифта: 100%; семейство шрифтов: наследовать; вертикальное выравнивание: базовая линия; } :focus {контур: 0;} a, a:ссылка, a:посещено, a:hover, a:active{text-decoration:none} таблица {схлопывание границы: отдельный; расстояние между границами: 0;} й, тд {выравнивание текста: слева; шрифт-вес: нормальный;} img, iframe {граница: нет; текст-декорация: нет;} ол, ул {стиль списка: нет;} ввод, текстовая область, выбор, кнопка {размер шрифта: 100%; семейство шрифтов: наследовать;} выберите {поле: наследовать;} hr {маржа: 0; отступ: 0; граница: 0; цвет: # 000; цвет фона: # 000; высота: 1 пиксель} |
Сброс CSS от Криса Потита
| * { вертикальное выравнивание: базовая линия; семейство шрифтов: наследовать; стиль шрифта: наследовать; размер шрифта: 100%; граница: нет; заполнение: 0; маржа: 0; } тело { отступ: 5 пикселей; } h1, h2, h3, h4, h5, h6, p, pre, цитата, форма, ul, ol, dl { поле: 20 пикселей 0; } ли, дд, цитата { поле слева: 40 пикселей; } стол { граница-коллапс: коллапс; расстояние между границами: 0; } |
Эрик Мейер Сбросить CSS
| HTML, тело, div, диапазон, апплет, объект, iframe, таблица, заголовок, tbody, tfoot, thead, tr, th, td, del, dfn, em, шрифт, img, ins, кбд, к, с, самп, малый, страйк, сильный, саб, суп, тт, вар, h1, h2, h3, h4, h5, h6, p, цитата, pre, a, сокращение, акроним, адрес, большой, цитировать, код, дл, дт, дд, ол, ул, ли, набор полей, форма, метка, легенда { вертикальное выравнивание: базовая линия; семейство шрифтов: наследовать; шрифт-вес: наследовать; стиль шрифта: наследовать; размер шрифта: 100%; контур: 0; заполнение: 0; маржа: 0; граница: 0; } :фокус { контур: 0; } тело { фон: белый; высота строки: 1; цвет: черный; } ол, ул { стиль списка: нет; } стол { граница-коллапс: отдельная; расстояние между границами: 0; } подпись, th, td { вес шрифта: нормальный; выравнивание текста: по левому краю; } цитата:до, цитата:после, q:до, q:после { содержание: ""; } цитата, q { кавычки: "" ""; } |