Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. Объектно-ориентированное программирование на PHP. Авторы: Кузнецов М.В., Симдянов И.В. C++. Мастер-класс в задачах и примерах. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Ссылка поверх рисунка.
 
 автор: Vlad-on   (14.05.2008 в 17:03)   письмо автору
 
 

Нужен совет как грамотнее сделать.
В общем есть картинка в виде горизонтальной кнопки размерами скажем 20 на 50 px. По верх нее лежит текстовая ссылка "продолжить". Как это все красивее оформить? Таблицей не охота - слишком грамоздко выходит. Может есть способ блоками?

Вариант таблицей, чтоб понятно было о чем говорю.


<table width=50px height=20px align=center valign=middle>
<tr>
<td background="Наша картинка"><a .....>Продолжить</a>
</td>
</tr>
</table>

   
 
 автор: elenaki   (14.05.2008 в 18:44)   письмо автору
 
   для: Vlad-on   (14.05.2008 в 17:03)
 

<a style="background: url('путь/к/картинке') no-repeat #основной_цвет_картинки_на_всякий_случай; width: ...; height: ...; display:block; padding-top: отступ_от_верха; padding-bottom:отступ_от_низа;">Продолжить</a>


PS в таблицу шириной 50px слово "Продолжить" не влезет :)

   
 
 автор: vlad-on   (14.05.2008 в 21:33)   письмо автору
 
   для: elenaki   (14.05.2008 в 18:44)
 

>PS в таблицу шириной 50px слово "Продолжить" не влезет :)
Ну... тож верно. Не подумал.
Сейчас ваш метод попробую.

   
 
 автор: vlad-on   (14.05.2008 в 21:53)   письмо автору
 
   для: elenaki   (14.05.2008 в 18:44)
 

Сделал немного подругому. В css файле написал:

a.price{
background: url('http://moto-116.ru/html/button.gif');
width: 83px;
height: 23px;
display:block;
padding-top:5;
padding-bottom:5;
font-family:arial;
font-size:10px;
color:#191970;
text-align:center;
text-decoration:none}


Все работает. Большое спасибо.

   
 
 автор: elenaki   (15.05.2008 в 10:50)   письмо автору
 
   для: vlad-on   (14.05.2008 в 21:53)
 

в свойство background надо бы прописать и какой-то цвет фона. если у кого-то отключены
картинки, а цвет шрифта совпадает или близок с цветом фона страницы, то ссылку можно
и не заметить.

   
 
 автор: vlad-on   (15.05.2008 в 16:54)   письмо автору
 
   для: elenaki   (15.05.2008 в 10:50)
 

На счет цветов думаю никаких проблем не будет. Фот страницы белый, цвет ссылки темно синий.

   
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования