как реализовать кнопку средствами CSS?

[Banderass]

Привет! Под кнопкой я имею ввиду ссылку-картинку, которая изменяется если на неё навести курсор. В общем когда наводим - картинка одна, а когда отводим - другая.

Какое свойство нужно использовать, что бы реализовать это??
Может есть какие-то альтернативные простые варианты?

[Aykroyd]

[Только зарегистрированные пользователи могут видеть ссылки. ]

[Banderass]

большое спасибо, изучаю :read:

[Banderass]

посоветуйте пожалуйста способ, что бы реализовать сабж, используя любые средства, но что бы это работало на большинстве браузеров, даже на старых.

[garA]

что бы это работало на большинстве браузеров, даже на старых.

ИМХО, это вопрос относительный, какой браузер считать старым..
Лично я обычно использую 1-й метод- Метод Pixy.. Любые комбинации значений background , определяющих стиль фона, поддерживаются всеми современными браузерами +ИЕ5+

[Aykroyd]

OFFTOP: )

Мда... (медленно, многозначительно и загадочно)

[summerstyle]

хтмл:

[Только зарегистрированные пользователи могут видеть ссылки. ]

css:

.knopka:link, .knopka:visited {
display: block;
width: 100px;
height: 100px;
background: url(knopka1.gif);
}
.knopka:hover, .knopka:active {
background: url(knopka2.gif);
}

[Aykroyd]

summerstyle
Я помню чудное миганье...
Передо мной явился ОН...

Круть у нас тут...

[Banderass]

проблема оказалась поглубже :biggrin2:

я буквально не умею слепить из хтмл и ксс готовую кнопку. Можете показать законченный пример, где бы была реализована кнопка-ссылка, о которой я писал в первом посте?

summerstyle
это не сработало как я хотел и ожидал. Вместо кнопки имеем символ "#" и на его фоне картинку кнопки, но не полная кнопка. Мне нужно что бы вообще не было никаких символов кроме самой кнопки.

[Aykroyd]

Banderass
При всем уважении к Вам, я вынужден констатировать, что у Вас нет даже каких-либо базовых знаний в области HTML и CSS. Здесь мы можем Вам помочь в решении какой-либо возникшей у Вас проблемы, но отвечать на вопросы, вызванные банальным нежеланием или ленью учиться, – это вне нашей компетенции.

Воспользуйтесь для начала простейшей специализированной литературой.

[garA]

я полностью согласен с Aykroyd..
на том сайте, который вам порекомендовал Aykroyd, все разложено по полочкам.. ну, ладно, проехали..
вот пример кнопки-ссылки:

[Banderass]

большое спасибо всем и последним двум ответившим форумчанам в частности. Подобный пример снимает все вопросы и вообще примеры всегда это делают k:

[Aykroyd]

Аминь. )

[Banderass]

а как сделать, что бы кнопки размещались в ряд?? Я пробывал изменять "block" на "inline", но после этого кнопки пропадают. Как решить эту проблему?

[Aykroyd]

Убираем block, убираем inline, вместо них ставим {float: left;} ...

[Banderass]

отлично, но мне нужно, что бы кнопочки выравнивались по центру таблицы. Если поменять "float: left;" на "float: center;", то они исчезнут.

Прикрепил измененный пример garA, в котором разместил простую табличку. Картинки из того же примера. Как сделать выравнивание кнопок по центру??

[Aykroyd]

1. float: center; – не существует.
2. не надо табличку... [Только зарегистрированные пользователи могут видеть ссылки. ]
3. а учиться Вы, к сожалению, так и не хотите...

[Banderass]

ну почему же?? очень хочу научиться !! Я привел в примере табличку, так как мой сайт полность базируется на табличной верстке. Объясните пожалуйста как произвести выравнивание по центру :blush2:

ну не могу я сейчас переделать сайт под блочную верстку так как не умею :fie:

[Aykroyd]

Originally posted by Banderass@May 21 2007, 23:18
ну почему же?? очень хочу научиться !! Я привел в примере табличку, так как мой сайт полность базируется на табличной верстке.
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Вы не табличку привели. Вы ГОВНОКОД привели. Ну неужели Вы не понимаете, что даже если я сейчас и скажу Вам как выровнять Ваши кнопки по центру, это не решит НИЧЕГО. Потому что человек должен знать не только ЧТО писать, но и ЗАЧЕМ это писать...

Вы !DOCTYPE свой видели? Вы хоть представляете что это вообще такое? Для чего Вы его такой написали? Где-то подсмотрели и решили, что сейчас так модно? Вы хоть представляете какую громадную ответственность влечет за собой подобное ОТД? Вы когда-нибудь слышали о валидаторах?

Originally posted by Banderass@May 21 2007, 23:18
Объясните пожалуйста как произвести выравнивание по центру* :blush2:
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Если Вы пытаетесь представить все табличной моделью, зачем "мучаете" блочные методы? Разместите каждую кнопку в отдельной ячейке таблицы. И всё! Если же следовать блочной модели – ваши кнопки должны представлять из себя СПИСОК (!), и именно пунктам этого списка необходимо будет задавать специальные стилевые правила...

Originally posted by Banderass@May 21 2007, 23:18
ну не могу я сейчас переделать сайт под блочную верстку так как не умею* :fie:
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Какая на хрен блочная! Вы табличную-то корректно выполнить не можете... Вы слышали когда-нибудь, что в пределах одного документа НЕ МОЖЕТ быть двух или более одинаковых значений атрибута ID? Не обижайтесь. Ничего личного. Просто НАДО учиться, НАДО читать литературу.

[Zigzag]

Originally posted by Banderass+May 21 2007, 20:18--><div class='quotetop'>Цитата(Banderass @ May 21 2007, 20:18)</div>

ну почему же?? очень хочу научиться !! Я привел в примере табличку, так как мой сайт полность базируется на табличной верстке. Объясните пожалуйста как произвести выравнивание по центру* :blush2:[/b]

для блочного элемента выравнивание производится автополями

элемент { margin: 0 auto; }

для ссылки вначале необходимо объявить блочное отображение

a { display: block; }

<!--QuoteBegin-Aykroyd@May 21 2007, 20:43
Вы не табличку привели. Вы ГОВНОКОД привели.
....
Просто НАДО учиться, НАДО читать литературу.
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]

Видите, как папу разнервничали. Читайте книги, многие вопросы отпадут сами собой! Удачи.