Как да направите красива връзка

Съдържание:

Как да направите красива връзка
Как да направите красива връзка

Видео: Как да направите красива връзка

Видео: Как да направите красива връзка
Видео: 🌺 Красивая! Удобная! Практичная! Летняя женская кофточка спицами. Часть 1. 🌺 Размер 48-50 2024, Може
Anonim

Връзките значително влияят на външния вид на уеб страница. Независимо дали става въпрос за вашия уеб сайт или блог, красиво персонализираните връзки ще променят дизайна на вашия уеб сайт към по-добро. Дори и без познаване на html и css, създаването на хубава връзка е доста лесно.

Как да направите красива връзка
Как да направите красива връзка

Инструкции

Етап 1

Първо, нека създадем редовна връзка. Това се прави със следния код: име на връзката. В този код тагът е връзка. Неговият атрибут "href" показва адреса на страницата, към която води връзката. Вместо „заглавие на връзката“напишете дума или фраза, която ще представлява връзката

Можете също да добавите текст, който ще се появи, когато щракнете върху връзката. Атрибутът "title" на маркера ще ви помогне с това.

Стъпка 2

Сега нека да стигнем до свързването. Най-лесният начин да направите това е в каскадни таблици със стилове (css). Отворете файла, съдържащ стиловете за вашия сайт и напишете допълнителен код там. Като алтернатива можете да вмъкнете стилове директно в HTML страницата. За да направите това, използвайте кода за персонализиране на стила на сайта.

Стъпка 3

Нека да стигнем до дизайна. Синтаксисът на записа би бил {параметри на стила}. Какво да напиша тук?

Първо, променете цвета на връзките по ваш вкус. Този код ще ви помогне с това:

{цвят: # 00000;}. Разбира се, вместо "# 00000" трябва да вмъкнете свой собствен цвят. Можете да разберете цветния код в тази форма в различни графични програми (например в Photoshop) или да намерите уеб палитра.

Стъпка 4

По подразбиране браузърът прави връзките подчертани. Това може да бъде отменено със следния код: a {text-decoration: none;}

За да създадете удебелени връзки, използвайте параметъра font-weight: bold; Той се вмъква в стиловия код по същия начин като цвета, подчертава.

Стъпка 5

Вероятно сте забелязали, че на някои сайтове, когато задържите курсора на мишката върху дадена връзка, външният й вид се променя. Можете да направите и това. Код като този ще ви помогне: a: hover {параметри на стила}. Параметрите са посочени по същия начин, както при обикновена връзка, единствената стойност е псевдокласът „hover“, който уведомява браузъра, че тези настройки трябва да се прилагат при задържане на курсора на мишката над връзката.

По същия начин можете да маркирате посетени връзки: a: посети {параметри на стила}

Препоръчано: