Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Красивая табличка 
:(
    Опции темы
Brain
Дата 11.11.2007, 01:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 49
Регистрация: 10.12.2006
Где: Россия, Новочерка сск

Репутация: нет
Всего: нет



Доброго времени суток!
Дело в чем:

Хочу сделать табличку(красивую smile ) чтоб, когда на ячейку наводишь мышкой, задний фон ее менялся, примерно как меняется цвет сцылки при наведении на нее(если б менялся шрифт содержимого в ячейке было б совсем замечательно!).
Только начал учиться HTML, CSS, PHP.(сильно ногами не пинать)

Заранее спасибо!  
PM MAIL ICQ   Вверх
MDM
Дата 12.11.2007, 15:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 264
Регистрация: 16.3.2007
Где: г. Нальчик

Репутация: нет
Всего: 4



Посмотри сайт http://i3forum.com/, вот там наверху как раз нужная тебе табличка!
Здесь http://i3forum.com/css/i3.css CSS код, с помощью которого это реализовано! Более подробно в книге "WEB-дизайн по стандартам", авт. Дж. Зельдман, его сайт www.zeldman.com

Лучше постарайся разобраться сам, если не получиться, помогу дальше!
PM ICQ Skype   Вверх
Alex103
Дата 13.11.2007, 19:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 416
Регистрация: 5.1.2005
Где: Украина, г. Харьк ов

Репутация: нет
Всего: нет



Я попробывал сделать твоим способом, но многих вещей не понял, не мог ли ты подробнее обьяснить как это сделать, и с чего начать?


--------------------
Мой адресс не дом и не улица, мой адресс WWW
PM MAIL WWW ICQ YIM   Вверх
Alex103
Дата 14.11.2007, 02:21 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 416
Регистрация: 5.1.2005
Где: Украина, г. Харьк ов

Репутация: нет
Всего: нет



Ребята, я нашел самый простой и самый быстрый способ сделать изменяющимся цвет фона ячейки при наведении курсора. 

Код


<table>
 <tr>
   <td onMouseOver="this.style.background='#FCE4A2'" onMouseOut="this.style.background='white'"  onClick="adress_kuda_link.html'" style="cursor: hand" ></td>
 </tr>


onMouseOver - цыет при наведении мыши 
onMouseOut - цвет после того как мышь вышла из области ячейки

Прошу заметить что после описания атрибута onClick вся ячейка становится ссылкой.

Добавлено через 48 секунд
Тема закрыта.


--------------------
Мой адресс не дом и не улица, мой адресс WWW
PM MAIL WWW ICQ YIM   Вверх
Brain
Дата 24.11.2007, 23:09 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 49
Регистрация: 10.12.2006
Где: Россия, Новочерка сск

Репутация: нет
Всего: нет



Пасиб, помогло. Правда я сделал ее раньше чем дождался ответа....
PM MAIL ICQ   Вверх
Alex103
Дата 25.11.2007, 01:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 416
Регистрация: 5.1.2005
Где: Украина, г. Харьк ов

Репутация: нет
Всего: нет



Эти все способы хороши но не настолько как CSS. Так как они слишком объемны. А в CSS можно сделать так.

Вот например у тебя таблица

HTML-файл
Код

<table>
 <tr>
  <td id="p1"><a href="#">Я подсвечиваемая ячейка</a></td>
 </tr>
</table>


А вот пример CSS файла.
Код

a{width:100px;height:50px;padding:5px;margin:10px;text-decoration:none;}
#p1 a:link{background:black;}
#p1 a:hover{background:white;}


В общем идея такова при наведении на ячейку она у тебя будет ссылкой в стандартном режиме она у тебя будет черной а при наведении буде белой. Также можешь добавить эфект при нажатии и посещении active и visited

Ну и фигурируй параметрами для данного id. А если у ебя много ячеек с одинаковым форматированием то просто создай псевдо класс или описывай какую-то закономернойсть пути.

Но для этого нужно учить CSS. smile В общем успехов.

Сразу предупреждаю я код не тестил.


--------------------
Мой адресс не дом и не улица, мой адресс WWW
PM MAIL WWW ICQ YIM   Вверх
Axielandr
Дата 10.5.2008, 07:03 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 7
Регистрация: 10.5.2008

Репутация: нет
Всего: нет



Всем привет, я еще новичок в php и у меня есть вопрос
Как сделать так, чтобы у таблички вместо простой сплошной стандартной  рамки был мой фрагмент рисунка для каждой из сторон рамки. Если не понятно то приведу кусок кода таблички, в которой я так и не разобрался:

<TABLE width=780 align=center cellPadding=0 cellSpacing=0><TBODY>
<TR><TD width='1%'><IMG src='images/$skin/1.gif' width=14 height=12 border=0></TD><TD width='96%' background='images/$skin/2.gif'></TD><TD width='3%'><IMG src='images/$skin/3.gif' width=14 height=12 border=0></TD></TR>
<TR><TD background='images/$skin/4.gif'></TD>
<TD>
<table width=100%><TR>
<TD><B>Сегодня <b>$date</b></TD>
<TD align=center><a href='index.php?event=new&page=$page'>Добавить сообщение</a></TD>
<TD align=center><a href='$mainpage'>Вернуться на главную</a></div></B>
</TD></TR>

Вот там в теги ячейки встявляются ссылки на рисунки, и я никак не могу понять закономерность...
Скажите че к чему плз?
PM MAIL ICQ   Вверх
egrik
Дата 12.5.2008, 00:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 62
Регистрация: 10.11.2006
Где: Voronezh

Репутация: нет
Всего: 1



Цитата(Axielandr @  10.5.2008,  07:03 Найти цитируемый пост)
Как сделать так, чтобы у таблички вместо простой сплошной стандартной  рамки был мой фрагмент рисунка для каждой из сторон рамки


Стандартными атрибутами html или css этого сделать на данный момент невозможно, поэтому нужно "основную" таблицу обрамлять еще одной, в которой как раз и будут те самые изображения (как правило, лежащие бекграундом). Что и приведено в прилагаемой тобой таблице.
PM MAIL ICQ Skype   Вверх
Ingvarr
Дата 22.11.2011, 03:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 1
Регистрация: 22.11.2011

Репутация: нет
Всего: нет



Тоже ищу красивую html табличку, пока ничего подходящего найти не смог 
PM MAIL WWW Skype   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0815 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.