Новости Joomla

1   Вниз
0 Пользователей и 1 Гость просматривают эту тему.
  • 13 Ответов
  • 1678 Просмотров
*

Hufflepuff

  • Захожу иногда
  • 124
  • 0 / 0
Вопрос по верстке материала
« : 05.02.2014, 07:42:27 »
Привет, хочу сделать что то вроде киоска на айпаде. программировать я врят ли смогу, самый простой способ сделать таблицу, а фоном сделать полку. но появляется косяк книжки начинают съезжать. подскажите как поправить. как то задать ширину колонки или еще что?
http://uicbs.ru/index.php?option=com_content&view=article&id=1729%3Akiosk&catid=24&Itemid=73

Код
<p style="text-align: center;">&nbsp;</p>
<table border="0" align="center" style="width: 500px; margin-left: auto; margin-right: auto; background-image: url('images/stories/kiosk/fon.png');">
    <tbody>
        <tr>
            <td align="center" valign="top"><img src="images/stories/newbook/01.10.2013/Aga%20popalsya.jpg" alt="Aga popalsya" width="63" height="90" class="bez" /></td>
            <td align="center" valign="top"><img src="images/stories/newbook/27.05.2013/magazin.jpg" alt="magazin" width="58" height="90" class="bez" /></td>
            <td align="center" valign="top"><img src="images/stories/newbook/01.10.2013/Aga%20popalsya.jpg" alt="Aga popalsya" width="63" height="90" class="bez" /></td>
            <td align="center" valign="top"><img src="images/stories/newbook/27.05.2013/magazin.jpg" alt="magazin" width="58" height="90" class="bez" /></td>
        </tr>
        <tr>
            <td align="center" valign="top">&nbsp;<img src="images/stories/newbook/27.05.2013/magazin.jpg" alt="magazin" width="58" height="90" class="bez" /></td>
            <td align="center" valign="top"><img src="images/stories/newbook/01.10.2013/Aga%20popalsya.jpg" alt="Aga popalsya" width="63" height="90" class="bez" />&nbsp;</td>
            <td align="center" valign="top">&nbsp;<img src="images/stories/newbook/27.05.2013/magazin.jpg" alt="magazin" width="58" height="90" class="bez" /></td>
            <td align="center" valign="top"><img src="images/stories/newbook/01.10.2013/Aga%20popalsya.jpg" alt="Aga popalsya" width="63" height="90" class="bez" />&nbsp;</td>
        </tr>
        <tr>
            <td align="center" valign="top">&nbsp;<img src="images/stories/newbook/01.10.2013/Aga%20popalsya.jpg" alt="Aga popalsya" width="63" height="90" class="bez" /></td>
            <td align="center" valign="top">&nbsp;<img src="images/stories/newbook/27.05.2013/magazin.jpg" alt="magazin" width="58" height="90" class="bez" /></td>
            <td align="center" valign="top"><img src="images/stories/newbook/01.10.2013/Aga%20popalsya.jpg" alt="Aga popalsya" width="63" height="90" class="bez" />&nbsp;</td>
            <td align="center" valign="top"><img src="images/stories/newbook/27.05.2013/magazin.jpg" alt="magazin" width="58" height="90" class="bez" />&nbsp;</td>
        </tr>
    </tbody>
</table>
Записан
*

dron

  • Завсегдатай
  • 1581
  • 16 / 10
Re: Вопрос по верстке материала
« Ответ #1 : 07.02.2014, 00:50:12 »
не пойму что и где съезжает? у меня все нормуль... какой браузер?
Записан
*

dron

  • Завсегдатай
  • 1581
  • 16 / 10
Re: Вопрос по верстке материала
« Ответ #2 : 07.02.2014, 00:50:42 »
на каких устройствах?
Записан
*

ShfVD

  • Давно я тут
  • 871
  • 65 / 0
Re: Вопрос по верстке материала
« Ответ #3 : 07.02.2014, 01:10:32 »
Выращиваются книжки в обёртка,  размер рисунка одинаков?
Приведи к одному виду, может пошепчет.
Записан
*

ShfVD

  • Давно я тут
  • 871
  • 65 / 0
Re: Вопрос по верстке материала
« Ответ #4 : 07.02.2014, 02:26:39 »
И не пойму зачем такая сложность - книжки(изображения) это даже не  ссылки.
Это можно было и в графическом редакторе сделать.
Опять же если таблица регулярная, зачем сколько различных классов использовать
(просто img, aglowonenon, bez, aglowone) -короче,  каша :(
Записан
*

dron

  • Завсегдатай
  • 1581
  • 16 / 10
Re: Вопрос по верстке материала
« Ответ #5 : 07.02.2014, 12:03:46 »
да, соглашусь, там не пойми что (((
Записан
*

Hufflepuff

  • Захожу иногда
  • 124
  • 0 / 0
Re: Вопрос по верстке материала
« Ответ #6 : 09.02.2014, 18:18:15 »
Дело в том что я на протяжении всего времени работал над ней. по этому она менялась, классов много отображения различных эффектов, при наведении на книжку срабатывают разные классы. смотрите чем больше книг я добавлю в таблицу тем больше сдвиг. по какой то причине не могу синхронизировать фон таблицы и содержимое. по идее каждая полка это картинка, если я задаю каждой строке размер картинки 110 пк. то идет сдвиг, сейчас использую 106 пк. но сдвиг все равно есть. Если бы можно было задать каждой строке фон возможно это бы решило проблему.
Записан
*

Hufflepuff

  • Захожу иногда
  • 124
  • 0 / 0
Re: Вопрос по верстке материала
« Ответ #7 : 09.02.2014, 18:23:21 »
вроде выравнил, подскажите как шапку прибить к таблице? видите там разрыв между таблицей и картинкой шапки. редактор подставляет тег <р> по этому такой разрыв
Записан
*

ShfVD

  • Давно я тут
  • 871
  • 65 / 0
Re: Вопрос по верстке материала
« Ответ #8 : 09.02.2014, 18:55:56 »
Записан
*

ShfVD

  • Давно я тут
  • 871
  • 65 / 0
Re: Вопрос по верстке материала
« Ответ #9 : 09.02.2014, 19:00:55 »
step 2
http://bit.ly/1nm6i62
На мой взгляд, попариться - разобраться с версткой и уйти от таблиц!
Записан
*

dron

  • Завсегдатай
  • 1581
  • 16 / 10
Re: Вопрос по верстке материала
« Ответ #10 : 09.02.2014, 19:35:02 »
ShfVD прав. Вы хотите потратить сверя и все равно сделать все через одно место. Потом аукнется. Гораздо лучше изначально все сделать правильно и по стандартам.
Записан
*

Hufflepuff

  • Захожу иногда
  • 124
  • 0 / 0
Re: Вопрос по верстке материала
« Ответ #11 : 10.02.2014, 09:41:26 »
ShfVD, извините если надоел, просто я не совсем умею находить поля в сss где не указана строчка кода и имя css  файла.
так же как вот это.
element.style {
text-align: center;
}
и такой вопрос. посмотрите я добавил стикер "новая" на книжки, если курсор попадет на него, то сама книга станет не кликабельна и классы что срабатывают при наведении на нее тоже не сработают.  можно как то игнорировать картинку стикер над книгой картинкой?
Записан
*

ShfVD

  • Давно я тут
  • 871
  • 65 / 0
Re: Вопрос по верстке материала
« Ответ #12 : 10.02.2014, 13:24:45 »
Есть такой инструмент FireBug называется, впрочем он сейчас встроен во все браузеры.
Для того, чтобы им воспользоваться нужно навести мышу на нужное место, нажать правую клавишу и выбрать
в мазиле и Chrome "Просмотр кода элемента",
в Opera "Проинспектировать элемент"
дальше по картинке, думаю, понятно
http://bit.ly/1egAhXp
Записан
*

ShfVD

  • Давно я тут
  • 871
  • 65 / 0
Re: Вопрос по верстке материала
« Ответ #13 : 10.02.2014, 13:47:46 »
Цитировать
element.style
это когда стиль задан не через таблицу CSS, а непосредственно в теге, например
<table style="width: 500px; margin-left: auto; margin-right: auto; background-image: url('/images/stories/kiosk/fon.png');"
Чтобы книги были кликабельными, нужна конструкция типа:
<a href="/путь к нужному материалу"> <img .......></a>
Записан
1   Вверх
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Вопрос при переходе на https/ Проблема с внутренними ссылками

Автор krot

 Ответов: 4
Просмотров: 2153 		Последний ответ 06.02.2018, 09:21:33
от krot
Вопрос о правильности разметки тегами на странице

Автор dpy1995

 Ответов: 10
Просмотров: 6440 		Последний ответ 09.01.2018, 12:49:25
от kungurskiy
Заголовок страницы вида Имя материала / имя категории / имя раздела /

Автор rubasket

 Ответов: 2
Просмотров: 24638 		Последний ответ 24.03.2017, 01:13:50
от mbgr
Поиск материала

Автор rjk112

 Ответов: 3
Просмотров: 1603 		Последний ответ 31.10.2016, 11:15:50
от rjk112
вопрос по использованию FireBug

Автор rkorkin

 Ответов: 5
Просмотров: 4063 		Последний ответ 06.08.2016, 17:34:23
от Saltanat