Технический форум

Технический форум (http://www.tehnari.ru/)
-   О сайте и форуме (http://www.tehnari.ru/f8/)
-   -   Есть ли у технарей своя кнопка? (http://www.tehnari.ru/f8/t84281/)

George Smith 25.01.2013 15:18

Цитата:

Сообщение от Ваня (Сообщение 853859)
Эх, была бы кнопочка побольше....

Ваня, дык нарисуй, кто тебе не дает ?... :)

Ваня 25.01.2013 15:20

Нет, я пожалуй оставлю логотип :)

Eli 26.01.2013 01:09

Цитата:

Сообщение от Ваня (Сообщение 853859)
Эх, была бы кнопочка побольше...

а кто мешает изменить размер?


это делается вот так : этот код с размером отображения картинки, как у меня на сайте - и с ним можно играть как хочешь ...

Код HTML:

<a href="http://www.tehnari.ru/"><img src="http://www.tehnari.ru/img/tehnari_ru.gif" width="130" height="50"
в точности - вот это
Код HTML:

width="130" height="50"
после
Код HTML:

<img src="http://www.tehnari.ru/img/tehnari_ru.gif"
посзволяет играть размерами...

George Smith 26.01.2013 12:36

Цитата:

Сообщение от Osher-E (Сообщение 854210)
а кто мешает изменить размер?

А вот это не советую делать, потом не узнаешь свои пикселы, лучше графически, натуральную величину ... :)

GlaZZZ 26.01.2013 18:57

Цитата:

Сообщение от George Smith (Сообщение 854325)
А вот это не советую делать, потом не узнаешь свои пикселы, лучше графически, натуральную величину ...

Ну чего? Кстати нормально масштабируется в HTML и CSS
Кстати можно код html сделать меньше чуток прописав размеры кнопки в CSS.

Код HTML:

.knopka{widht: 100px; height: 100px}
А потом в HTML ссылочка прописывается так
Код HTML:

<a href="ссылка"><img class="knopka" src="/img.png"></a>
Т.е. в html в коде картинки мы присваиваем картинке класс knopka, а сами стили класса прописываются в CSS
Можно сделать с картинкой что угодно. Даже прозрачность.
Можно сделать кнопку, при наведении на которую мышкой, она станет полупрозрачной.

Стиль CSS при наведении прописывается вот так
Код HTML:

.knopka:hover {opacity: 0.5}
где opasity это коефициент прозрачности(1 - это непрозрачность), а hover это тег который показывает, что стиль прописывается для наведения мышкой

George Smith 26.01.2013 19:28

Цитата:

Сообщение от GlaZZZ (Сообщение 854553)
а hover это тег который показывает, что стиль прописывается для наведения мышкой

От это больше всего интересует? Так как я в языках CSS и html - честно дуб (нуб). Графику в оригинале делаю, программы писал когда-то, чисто Ассемблер и DOS, ну Бейсик знаю, надо начать программировать WEB, хороший блокнот есть в наличии. Надо так, GIF-файл, 2 кадра, при наведении мышой, надо чтобы кнопка утапливалась ? ... :)

GlaZZZ 26.01.2013 19:30

Цитата:

Сообщение от George Smith (Сообщение 854572)
От это больше всего интересует?

не понял смысла выражения чуток :D
Вам рассказать по-подробнее??

George Smith 26.01.2013 19:41

Понятно, почему не понял чуток. Еще раз, есть допустим файл GIF (кнопка), файл 2 кадра, первый кадр просто кнопка, второй - утопленная кнопка (нажатая). Координатно все на месте, это просто графический обман зрения, при нажатии на мышь кнопка утапливается, т.е. при нажатии вместо первого кадра появляется второй ... :)

GlaZZZ 26.01.2013 19:50

Цитата:

Сообщение от George Smith (Сообщение 854589)
Еще раз, есть допустим файл GIF (кнопка), файл 2 кадра, первый кадр просто кнопка, второй - утопленная кнопка (нажатая). Координатно все на месте, это просто графический обман зрения, при нажатии на мышь кнопка утапливается, т.е. при нажатии вместо первого кадра появляется второй ...

Можно и так. Т.е в стиле .knopka фоном будет первый файл, а в стиле .knopka:hover будет второй фон(второй файл с утопленой кнопкой). Только hover - стиль срабатывает при наведении мышкой на кнопку.
Для нажатия, если я не ошибаюсь, сущестует тег active, он ставиться как и hover, только срабатывает, по-моему, при нажатии кнопки мыши

GlaZZZ 26.01.2013 19:52

Вот про CSS active htmlbook.ru - CSS - Псевдокласс :active
А вот про CSS hover htmlbook.ru - CSS - Псевдокласс :hover

Кстати при помощи CSS можно делать анимации(прогресс бары, например), можно делать градиенты, скругления углов, непрозрачность(opacity - не работает в недобраузере IE), рамку, шрифт, цвет шрифта. Короче в CSS можно делать практически всё. Иногда даже проще CSS прописать, чем нарисовать картинку в том же фотошопе.


И кнопку можно сделать в виде нажатой с помощью CSS, сделав внутреннюю тень или смещение фона.


Часовой пояс GMT +4, время: 07:51.

Powered by vBulletin® Version 4.5.3
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.