1. Есть список с ссылками (распространненая конструкция):
и с помощью CSS нужно добится, чтобы ссылки шли в строчку через разделитель |. Как можно добится? (1 прикрепление = Безымянный)
2. Можно ли сделать горизонтальную черточку (<hr>) не сплошную, а в точку (2 прикрепление - sfg).
3. Нужно сделать вот такую штуку (3 прикрепление - gsafgsf). колонки имитируем фоном родительского бокса, но вот как тогда сделать заукругленные края - я не знаю.
1. А зачем список, если такая структура?
Вообще, display: block; float: left; padding-left: 10px; background: url(marker.gif) left no-repeat;
2. Можно.
3. Не въехал в вопрос
1. Ну по смысла CSS - что оформлением занимается CSS. в HTML чаще всего меню идет именно списком. Если так, как вы сказали - слева перед первым пунктом будет палочка. Нам нужно только посредине.
2. Как?
3. Как мне сделать такое как на скришноте? (средний скриншот). Три колонки в квадрате с заокругленными краями.
еще к первому. Хочу как здесь:
[Только зарегистрированные пользователи могут видеть ссылки. ]Одна из самых важных (хоть и не единственная) целей CSS — отделение средств оформления страницы (CSS) от задания ее структуры (HTML). Это дает большие плюсы в процессе разработки и поддержки сайта, от возможности полностью раздать программирование и верстку разным людям до возможности иметь разный дизайн страниц с одинаковым HTML одновременно (я как раз сейчас занят одним таким проектом, где движок и структура HTML’а одна, но сидит он на разных сайтах).
Структура HTML для “Мегакорпорации” задана с самого начала, и не меняется. Некий гипотетический проектировщик решил, что блоки #main, #sections и #news равнозначны, и объединил их в один контейнер. Лишний контейнер, объединяющий #sections и #news изменит эту структуру, и хоть это и подойдет текущему дизайну, это не подойдет какому-нибудь другому, который решит визуально выделить #sections, а #main и #news расположить в колонках.
Другими словами, меняя структуру HTML исключительно ради визуального оформления мы уничтожаем этот конкретный плюс CSS’а. В принципе, если мы готовы отказаться от разделения структуры и оформления, то стоит вообще подумать, не надо ли нам верстать таблицами, потому что они, как инструмент, часто куда надежнее и проще CSS’ных раскладок.
Другое дело, что на практике так иногда приходится делать как раз потому, что CSS — не самая идеальная реализация задумки. Здесь это, в общем, обычный инженерный вопрос оценки плюсов и минусов. Например, если у нас уже есть полностью сверстанный сайт, а заказчик вдруг придумал что-то, на что CSS с текущей структурой не способен, то можно пожертвовать частью гибкости и запихнуть новый контейнер, потому что переделывать весь сайт дороже. Больше того, если какая-то вещь выглядит визуально очень логично, то это повод подумать, а не ошиблись ли мы изначально в структуре, если она такого не позволяет.
Но вот так без оглядки “просто добавить div” — это не CSS-верстка :-)
1.
Тогда это точно не список...Если так, как вы сказали - слева перед первым пунктом будет палочка. Нам нужно только посредине.
Для первого li пишете background: none; padding-left: 0px;
2. border: 0px; border-top: 1px dotted #ccc; height: 1px; ИЕ только гавно тут. Точки точками становятся только при 2пикс+
А как насчет третьего?
Хоть бы теоретически напишите, что да как, я с кодом уже я разберусь
Zigzag
дзякуй за ссылка! Ступил насчёт background-image.. Конечно, border..
а я уж было подумал, что без класса нельзя...Код:#nav{ * overflow:hidden; * width:100%; } * #nav li{ * margin-left:-1px;/ }
KukMan
Ну, блин, сложно это сделать просто... Ну не таблицей же честное слово...А как насчет третьего?
Хоть бы теоретически напишите, что да как, я с кодом уже я разберусь
Тут или бамбить дивов нереальное количество... или под индивидуальный случай... Короче, вот как я себе это представляю, но проблемы с размерамиотступамибордера ми...
в ФФ немного коряво. И ни могу исправить эту корявость.А чисто CSS'ом как я понял, сделать нереально.
[/quote]
float: left; уже сам по себе подразумевает display: block; )
[/quote]
Не обязательно border. Сдвигать меню для достижения обсуждаемого эффекта можно и при использовании background-image...
[/quote]
Все реально. Верхние закругленные края можно пустить, например, фоном заголовков. А нижние – например, фоном футера. Сложность выполнения этой задачи зависит от разных факторов. Например, от "резиновости" колонок. Но нерешаемой CSS-раскладки не бывает...
Я ждал ответа Aykroyda. Сори за оффтоп.
Даже если без изменений html файла?Но нерешаемой CSS-раскладки не бывает...
[/quote]
Иногда, конечно, приходится и дополнительный див добавить. Это извечный вопрос "цели и средств". Мы всегда должны стремиться обходиться без этих "лишних" дивов. Но что делать, если, например, необходимо добавить закругленные углы "резиновому" блоку? Или вынести основной контент в коде наверх? Пока эти задачи, к сожалению, решаются только вставкой дополнительных элементов. И от этого никуда не денешься...
Другое дело, когда авторы начинают в оформительских целях вставлять дополнительные блоки туда, где можно преспокойно обойтись и без них. И именно вот это умение увидеть это "обойтись" приходит только со временем. С опытом и практикой...
истину глоголишь, отец наш!Originally posted by Aykroyd@Jun 29 2007, 01:00
[b]...именно вот это умение увидеть это "обойтись" приходит только со временем. С опытом и практикой...
float: left; уже сам по себе подразумевает display: block; )
Конечно можно, но бордером-то прощеНе обязательно border. Сдвигать меню для достижения обсуждаемого эффекта можно и при использовании background-image...
Ну с нерезиновыми блоками всё просто... Я хотел растягивающийся во всех направленияхСложность выполнения этой задачи зависит от разных факторов. Например, от "резиновости" колонок. Но нерешаемой CSS-раскладки не бывает...
Да уж... Сидел долго... Ничего лучше, чем было не получилось...Пока эти задачи, к сожалению, решаются только вставкой дополнительных элементов. И от этого никуда не денешься...
Ясненько. ответ получил в полной мере. топ клоуз
[/quote]
Иногда вместо "палочек" маркеры бывают. Недавно верстал сайт для кофейной компании – там как раз обсуждалось кофейное зернышко в качестве разделителя пунктов горизонтального меню. При этом перед первым пунктом это зернышко заказчик не хотел... Также не всегда бордер удачно выравнивается по вертикали по отношению к тексту пунктов. С бэкграундом такой проблемы нет...
[/quote]
В каких это направлениях? Там задача была поставлена – колонки с Faux Columns. При данной технике они по умолчанию вниз тянутся. )
Ваши права
