Web-мастеру

 У вас есть идея насчет сайта? Вы хотите написать о своей самоделке нам? Тогда вам сюда или пришлите её нам на e-mail: admin@dari-pats.lv.

Новость должна быть уникальной. 

Ссылка и кнопка в HTML

Автор 
Оцените материал
(2 голосов)

Снова привет и снова я расскажу вам про два тега в языке html. Мы научимся связывать наши страницы ссылками и делать кнопки на нашем сайте. Первый тег, который мы рассмотрим, будет <a> </a> если его написать ничего мы не добьемся ля этого нам нужно написать к нему атрибут «href» в итоге мы получим активную ссылку. Например, у нас есть две страницы:

 

Первая страница
<html>
<body>
<p>Картинки</p>
</body>
</html>

 

Вторая страница

<html>
<body>
<p align="center">
<img src=images/3.png width="250" heidht="250">
<img src=images/12.png width="250" heidht="250">
<img src=images/13.png width="250" heidht="250">
<img src=images/14.png width="250" heidht="250">
</p>
</body>
</html>

Страница в блокноте

Галерея в блокноте

Работа страницы в браузере

Галерея в браузере

 

 

 

 


Вот и мы хотим, чтобы с первой нашей страницы кликнув по слову «картинки» мы перешли на вторую страницу с этими картинками. Так сказать галерея небольшая, чтобы нам это сделать нужно всего лишь указать путь к ней и сделать слово картинки ссылкой. Первая страница у нас называется «kartinki.html » вторая «gallery.html». Мы берем, наш тег <a href=gallery.html> </a>. Для того, чтобы ссылкой стал текст мы перед словом пишем <a href=gallery.html> а в конце слова мы закрываем </a>. Пример:


<html>
<body>
<a href=gallery.html> <p>Картинки</p></a>
</body>
</html>

Ссылка

Работа ссылки

 

 

 

 


Как мы видим все работает, вот таким простым способом можно соединить страницы вашего сайта.

 

 

Я обещал научить делать кнопки для сайта итак приступим: для этого нам понадобится тег <button>. У него есть множество атрибутов так, что можно с ними играться. Вот для примера:


<html>
<body>
<button.>Наша кнопка</button>
</body>
</html>

Кнопка

Кнопка

 

 

 

 


Этом теге можно писать текст, но также можно сделать и кнопку с картинкой. Для этого в тег button надо заключить картинку и написать текст по желанию. Пример:


<html>
<body>
<button><img src=images/chrome-icon.jpg>Скачать браузер Google Chrome</button>
</body>
</html>

Кнопка с картинкой

Кнопка с картинкой

 

 

 

 


Также конечно можно все совмещать, например картинку, текст и ссылку на другую страницу. Удачи!

 

Реклама

Наши группы

Поддержи проект

WebMoney Кошельки

wmE E360805809023

wmR R200307929169

wmZ Z127913139149

Три случайные новости

  • Кулер с подсветкой
    Кулер с подсветкой Итак, сегодня я расскажу, как сделать кулер с подсветкой. Для этого нам понадобится: 4 светодиода…
  • Деревянная брошь с объемным рисунком
    Деревянная брошь с объемным рисунком Мастер-класс «Деревянная брошь с объемным рисунком»   Для работы потребуется: -Деревянная заготовка для броши/пуговицы/кулона, -Металлическая…
  • Тег p и заголовки
    Тег p и заголовки  Снова всем здравствуйте сегодня, мы рассмотрим, такой тег как <p> и <h1></h1>….<h6></h6>. <p> этот тег…