#html #css #xhtml #css-tables
#HTML #css #xhtml #css-таблицы
Вопрос:
Я применил следующий сброс CSS к таблице стилей CSS моего сайта (проверка как CSS 2.0 и используется с переходной веб-страницей XHTML 1.0)
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
Однако на моем веб-сайте у меня есть таблица, которая больше не выглядит правильно. Точнее, таблица теперь не в нужном положении, а границы (изначально черные) больше не видны.
Мне интересно, должен ли я просто удалить таблицу, правила границ, могу ли я сохранить сброс как есть и позже сообщить браузеру отображать или нет границы. Мое главное сомнение заключается в том, что я хотел бы сохранить одинаковый сброс для всех моих страниц и что изменение сброса только для страниц, содержащих таблицы (табличные данные), только усложнит все, поскольку я использую ВНЕШНЮЮ ТАБЛИЦУ СТИЛЕЙ.
Комментарии:
1. Почему вы удивлены, что установка границы в 0 в вашем CSS для таблиц удаляет границы таблицы? Сброс не предназначен для того, чтобы хорошо выглядеть, он предназначен для выравнивания игрового поля в браузерах.
2. Живая ссылка была бы очень полезна — есть ли шанс на это? (хотя @RedFilter делает хороший вывод 🙂
3. Где в вашем css находится этот сброс? Вверху? Если это после стилей для вашей таблицы, то это будет иметь приоритет.
4. хорошо для понятия сброса, оно гарантирует, что веб-сайт выглядит одинаково во всех веб-браузерах.
5. да, дозер Блейк, мой сброс находится в самом верху таблицы стилей css
Ответ №1:
Быстрое исправление: просто удалите весь код таблицы из вашего сброса
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
margin:0;
padding:0;
border:0;
font-size:100%;
font:inherit;
vertical-align:baseline;}
Лучшее решение, используйте нормализатор css, а не сброс: взгляните на тот, который используется в проекте html5boilerplate
Комментарии:
1. это может быть решением, повлияет ли это на остальную часть моего сброса?
2. нет, я только что удалил
table,caption,tbody,tfoot,thead,tr,th,td,его, поэтому другие ваши стили не затронуты3. А еще лучше, изучите невероятно мало значений по умолчанию и создайте свой собственный базовый начальный CSS по желанию. Ничто не заменит знание того, с чем вы имеете дело.
Ответ №2:
Если я чего-то не понимаю (я не знаю, что вы подразумеваете под «сбросом css»), вы говорите, что table, td, th (и множество других тегов) не должны отображать границ. Итак, почему вы ожидаете, что после этого у вашей таблицы будут границы?
Комментарии:
1. Я предполагаю, что у них также есть стиль таблицы, но похоже, что это загружается после этого стиля, и, возможно, они не понимают, что CSS будет идти сверху вниз и применять их.
Ответ №3:
После устранения неполадок с аналогичной проблемой я обнаружил, что сброшенный css имеет свойство таблицы:
border-collapse: свернуть; из-за чего граница не отображалась.
Добавление… border-collapse: separate; в моем примененном css проблема устранена.