Cum de a schimba culoarea de link-uri și referințe de fond?
Acest lucru se poate face cu ajutorul CSS, codul ar arata astfel:
Rezultatul va fi după cum urmează (în cod, putem schimba culoarea textului, culoarea de fundal, pe care este scris textul și lățimea marginilor în jurul textului):
Faceți clic pe link-ul de pe mouseover
Aici este un exemplu de a crea link-uri, dar nu și textul, așa cum este în mod tradițional și faceți clic. Uneori ai nevoie pentru a evidenția legătura dintre text, buton frumos - doar de drum. Vom veni în ajutorul CSS:
Rămâne să se aplice stilul în practică. Se pare ceva de genul:
Ref imagine
Un efect similar pentru a decora link-ul cu ajutorul imaginilor pot fi realizate prin următorul cod. Vă rugăm să rețineți, vom folosi două imagini și on.gif Data înregistrării:, ele variază în funcție de ceea ce a condus la ea mouse-ul sau mouse-ul este eliminat:
Imagine de afișare atunci când treceți peste un link
Dacă aveți nevoie pentru a afișa o imagine atunci când treceți peste un link (ca un indiciu, ilustrații, etc), puteți pune în aplicare similare pe CSS pur:
Aici este codul pentru punerea în aplicare a:
Imagine atunci când treceți peste un link
Ca urmare, atunci când treceți cursorul pe link-ul de lângă acesta va fi indicat în setările de imagine din fereastra pop-up.
Arată tooltip atunci când treceți peste un link
Comercializam o tooltip atunci când treceți cursorul mouse-ului peste link-ul folosind codul CSS:
tooltip border-bottom: 1px punctată # 000000; culoare: # 000000; schiță: nici una;
cursor: de ajutor; text-decoration: none;
Poziția: relativă;
>
.Durata tooltip margin-left: -999em;
Poziția: absolută;
>
.tooltip: Hover interval de frontieră rază: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
box-umbra: 5px 5px 5px RGBA (0, 0, 0, 0,1); -webkit-box-umbra: 5px 5px RGBA (0, 0, 0, 0,1); -moz-box-umbra: 5px 5px RGBA (0, 0, 0, 0,1);
font-family: Calibri, Tahoma, Geneva, sans-serif;
Poziția: absolută; stânga: 1em; sus: 2em; z-index: 99;
margin-left: 0; lățime: 250px;
>
.tooltip: hover img frontieră: 0; Marja: -10px 0 0 -55px;
float: left; Poziția: absolută;
>
.tooltip: Hover em font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold;
display: block; padding: 0.2em 0.6em 0 0;
>
.clasic
.obicei
* HTML a: hover
.clasic
a.link, a.link: vizitat, a.link: culoare Hover: # 000;
cursor: text;
text-decoration: none;
>
Codul HTML-pagina propicyvaetsya:
ancora link-uri criptate
cod de referință poate aranja în mod similar mod
Atunci când treceți cursorul peste un link utilizatorul va vedea în banda de sugestii „nu este un link de recomandare“, dar, în cazul în care clicurile pe un astfel de link-ul, browser-ul său va merge doar pentru „un link de recomandare“.
De fapt, acestea sunt doar câteva exemple populare pentru a face referire la site-ul expresiv și clickable. Principalul lucru - nu exagera!
M-am specializat în site-uri de securitate: site-uri de protecție împotriva atacurilor și rupe-in-uri, viruși face site-urile de tratament și de prevenire.
Cu siguranță aveți orice întrebări, solicitări sau sugestii. Nu ezitați să întrebați, eu răspund întotdeauna prompt.
Scrie, dacă orice întrebare să vă mulțumesc!
feedback rapid
4 comentarii la „Cum de a obține oameni să faceți clic pe link-urile dvs.? "
Afișează imaginile atunci când treceți pe link-ul de SO
Vă mulțumesc foarte mult, a efectuat un experiment.
Vă mulțumim pentru interesante informații, aveți nevoie pentru a încerca, dar întrebarea este, dacă vom presupune, pe baza cunoștințelor minime de foi de stil într-un fișier pentru a pune codurile, site-ul condițională este alimentat de WordPress, șablonul, The single.php sau în foaia de stil? Vă mulțumim!
Stiluri () pentru stiluri (style.css). Este posibil și înregistrarea / corp a paginii, dar pentru o puritate de cod primul exemplu de realizare este de preferat.