| Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате |
| Форум программистов > Вёрстка веб-сайтов > HTML страница |
| Автор: Pitbul 31.8.2009, 15:34 |
| Добрый день, я сверстал HTML страничку, но ее структура далека от идеала - нерационально используются *.jpg в бэкграундах. Подскажите пожалуйста, как можно реализовать создание бэкграундИмэджей в таблицах, по схеме: -top.jpg >>> no-repeat -middle.jpg >>> repeat-y -bottom.jpg >>> no-repeat Я так понимаю в этом построении идет экономия ресурсов трафика за счет единаждой загрузки "полоски" middle.jpg и дальнейшего ее повтора до скольки надо за счет repeat-y |
| Автор: bars80080 31.8.2009, 17:55 |
| разбиваете общий блок на несколько, делается это либо таблицей, либо вложенными дивами. укаждого свой бэкграунд. углы no-repeat, впромежутки - repeat-x и repeat-y |
| Автор: Pitbul 31.8.2009, 18:11 |
| bars80080 С тегами <div> я не очень хорошо работаю. А если использовать <table> для этих целей, то надо каждый элемент разбивать на 3 мини <table> правильно? |
| Автор: Pitbul 31.8.2009, 20:15 |
| brother79 Т.е. лучше создавать одну таблицу и в CSS прописывать правила для ее трех <td> Ну а <div> я освою, но в ближайшее время не выйдет |
| Автор: brother79 1.9.2009, 04:59 | ||
Ну да, цсс, довольно сильная штука. Первый раз мне тоже было страшно книжку по цсс читать, но на самом деле, используя цсс - можно любой блок перестроить как тебе надо, чтобы не лепить новых, соответственно потому дивы и приобретают популярность, а таблицы уходят в прошлое, что див - это нечно бесформенное, у которых мало что предопределенно, а всё остальное поведение стилями можно задать любое. Единственный случай, где я продолжаю юзать таблицы - когда надо сделать именно таблицу, с одинаковыми по высоте строками, т.к. с дивами это геморно, или надо js подключать. Хотя если бы небыло микрософта - было бы намного проще. |
| Автор: Pitbul 1.9.2009, 15:45 |
| brother79 Ну пока что попробовал только внутри таблиц использовать <div> с разными графичискими эфектами. А так что бы целую страницу сверстать блоками, то наверное еще не смогу=) ПРОБЛЕМА РЕШЕНА! |
| Автор: olegti 1.9.2009, 17:54 | ||
это будет выглядеть примерно так
для каждой ячеки (td), прописавыешь класс, где указываешь сам "background" и его свойства "repeat" и т.д. |
| Автор: brother79 1.9.2009, 19:24 |
| А смысл делать 3 таблицы в каждой по 1 строке и по 1 столбцу? Можно 1 на 3 строки, без отступов и бордюров, а лучше вообще 3 дива у каждого: float:left; width:100%; height:<высота>; ну и соотвественно background со всеми нужными параметрами. |
| Автор: Pitbul 1.9.2009, 21:13 |
| brother79, olegti Спасибо, интресные методики, но все таки я так понимаю <table> использовать это действительно по олдскульному. Буду учиться <div> стилю |
| Автор: bars80080 1.9.2009, 22:21 | ||
а это зачем, для вертикально расположенных дивов? olegti, это будет выглядеть примерно так
|
| Автор: brother79 2.9.2009, 06:13 | ||
Не спорю, есть и другие варианты, но мне так проще. Есть вар-ны, когда дивы просто друг на друга ложатся, я иногда такие приёмы использую, но в этой теме немного плаваю, но если им поставить float:left и по ширине они не влезают - то они железно друг за другом лягут. Вообще всегда есть масса вар-ов вёрстки, с одним результатом внешне, и всегда можно выбрать. Добавлено через 1 минуту и 46 секунд
Ты забыл про высоту строки, т.к. если картинка будет фоном, а не img - то надо высоту руками писать |
| Автор: bars80080 2.9.2009, 10:05 |
| brother79, я всего лишь переписал то что предложил olegti, там много чего нет |