Upotrijebite CSS za stiliziranje oznake za oznake
oznaka je vizualni prikaz popisa stavki. Često ćete vidjeti oblake s oznakama na blogovima. Izradili su popularnost web-lokacijama poput Flickra.
Oblaci oznaka popis su veza koje se mijenjaju po veličini i težini (ponekad i boja) ovisno o nekoj mjerljivoj atributima. Većina se oznaka s oznakama temelji na popularnosti ili broju stranica koje su označene tom određenom oznakom. Ali možete izraditi oznaku iz bilo kojeg popisa stavki na svojoj web-lokaciji s najmanje dva načina prikazivanja. Na primjer:
- Popis članaka abecednim redom s stilovima koji ukazuju na popularnost članaka.
- Popis web stranica po abecednom redu s stilovima koji označavaju one koje vam se najviše sviđaju.
- Popis web izdavača naveden je u cjenovnom poretku s stilovima koji upućuju na to kako blizu svaki od njih dolazi do unaprijed određenog skupa kriterija.
- Popis prijatelja s stilovima koji ukazuju na udaljenost od vaše kuće do njihovih.
Što trebate napraviti oznaku za oznake?
Lako je izgraditi oznaku oblaka, trebate samo dvije stvari:
- Popis stavki (kao što su web-članci, web stranice ili vaši prijatelji)
- Mjerenje za svaku od stavki (poput prikaza stranice po danu, vašeg ranga 1-10 ili udaljenosti do vaše kuće).
Većina oznaka oblaci su popisi veza, pa pomaže ako svaka stavka ima povezani URL. Ali to nije potrebno stvoriti vizualnu hijerarhiju.
Koraci za izgradnju Tag Cloud popularnih veza
Moja web lokacija sadrži članke koji svakodnevno ostvaruju prikaze stranica, a to je jednostavan mjerni podatak za upotrebu za stvaranje oznake. Dakle, za ovaj primjer, izradit ćemo oznaku s popisa članaka, od kojih je najvažniji 25 članaka na mojoj web lokaciji za tjedan dana 1. siječnja 2007.
- Odredite koliko razina želite u svojoj hijerarhiji.
- Iako je moguće da imate što više razina u oblaku kao što imate stavke na popisu, to postaje zamorno kodiranje, a razlike mogu biti vrlo minimalne. Preporučujem da nema više od 10 razina u vašoj hijerarhiji.
- Odlučite o odrezanim točkama za svaku razinu.
- Moglo bi biti tako jednostavno kao rezanje prikaza stranica dnevno u 1/10 kriške - tj. ako najveća stranica na vašem web mjestu dobije 100 pregleda po danu, mogli biste ga slomiti kao 100+, 90-100, 80-90, 70-80, itd. Smanjivam prikaze stranica na taj način.
- Navedite svoje stavke u poretku za prikaz stranice i dajte im rang na temelju koraka 2
- Ne brinite ako nemate nijednu stavku u nekim od utora, što samo čini oblak zanimljivijim.
- Smjestite svoj popis prema abecednom redu (ili drugoj drugoj vrsti koju želite koristiti).
- To je ono što čini oblak zanimljivim. Ako ga ostavite poredane prema poretku, onda će to samo biti popis s najvećim artiklima na vrhu do najmanjih na dnu.
- Napišite svoj HTML tako da je čin broj klase. class = "tag4"> Dodavanje Streaming Audio datoteka
Nakon što dobijete HTML za svaku pojedinu stavku popisa i redoslijed kojim želite prikazati, morate donijeti odluku. Veze možete staviti u odlomak i učinit će vam se. Ali to ne bi bilo semantički označeno, a bilo tko bez CSS-a koji dolazi na vašu oznaku oblak jednostavno bi vidio veliki odlomak veza. HTML za ovu vrstu popisa izgledao bi ovako:
Dodavanje strujnih audio datoteka Osnovne oznake za web stranicu Najbolji softver za web dizajn Izgradnja web stranice za potpuno izgubljeno Simbol boje Umjesto toga, preporučujemo da izradite svoj tagovni oglas pomoću neurednog popisa. To je još nekoliko linija HTML i CSS koda, ali osigurava da će sadržaj biti čitljiv bez obzira na to tko dolazi da ju pregleda. HTML bi izgledao ovako: Sad dolazimo do zabavnog dijela - CSS stilova. Kada oblikujte oznaku oblaka, obično mijenjate veličinu fonta i težinu fonta. Također možete promijeniti boju fonta ili pozadinu ili bilo koji drugi stil atribut, ali veličina i težina su tradicionalni. Trebate 10 stilskih razreda, jedan za svaki rang: Želim uključiti neke stilove oko samog oblaka: centrirati tekst oblaka, postaviti visinu linije tako da je oblak čitljiv i paziti da oznake sidra ne budu ispunjene: Konačno, ako upotrebljavate semantički način stylinga (tj. Neuredan popis), trebate dodati još dvije linije CSS-a tako da popis nema metke i nije razrezan:
Ali gdje su stilovi za Tag Cloud