Akių traukimo sąrašų sudarymo CSS
Sąrašai yra puikus interneto dizaino elementas, nes juos galutinis vartotojas gali lengvai skaityti. Dauguma vartotojų nori atsakymų greitai ir iš pradžių tik nugriaus svetainę, kad sužinotų, ar ji atsakys į jų klausimą. Tai ypač aktualu, jei jie patenka į jūsų svetainę per paieškos variklį.

Antraštės ir sąrašų naudojimas yra puikus būdas žmonėms leisti lengvai pamatyti pirminį jūsų svetainės turinį. Jei jiems atrodo, kad sąrašai ir paantraštės yra įdomūs, yra didesnė tikimybė, kad jie liks jūsų svetainėje. Tai, žinoma, lemia mažesnius „atmetimo“ procentus ir padeda pagerinti jūsų svetainės patikimumą bei reitingą varikliuose. Viskas, kas pagerina skaitomumą ir leidžia akims lengviau nugrimzti, visada bus naudinga svetainei. Puikus dizainas visada turi omenyje skaitomumą.

CSS yra lengvas ir labai efektyvus būdas sukurti stilingus sąrašus su pasirinktinėmis kulkomis (žymekliais). Galite įtraukti skirtingas formas ar paprastą pasirinktinę grafiką, susietą su jūsų svetainės logotipu, spalvomis ar tema. Pavyzdžiui, „ghost tours“ svetainėje sukūriau mažą vaiduoklio piktogramą, kuri buvo naudojama šoninėje naršymo juostoje ir pagrindinio puslapio netvarkingų sąrašų elementuose. Tai buvo paprasta, bet labai miela ir susieta su svetainių tema, todėl šie puslapio elementai išsiskyrė.

Kitu metu kulkos gali atitraukti dėmesį nuo svarbaus sąrašo turinio. Tokiu atveju sąrašo stiliaus ypatybė „nė viena“ gali būti naudojama automatiškai sugeneruotiems žymekliams pašalinti.

Išvardinkite stiliaus ypatybes



Norėdami pasirinkti žymeklio, rodomo su kiekvienu sąrašo elementu, tipą, naudokite sąrašo stiliaus tipo ypatybę. Galimos vertės yra diskas, apskritimas, kvadratas, dešimtainis, žemesnioji romėnų, viršutinė romėnų, žemesnioji graikų, apatinė lotynų, viršutinė lotynų, apatinė alfa, viršutinė alfa ir nė viena.

Norėdami nurodyti savo atvaizdą kaip žymeklį, naudokite sąrašo stiliaus vaizdo ypatybę taip:

ul {list-style-image: url (atvaizdo vardas.jpg);
sąrašo stiliaus padėtis: išorėje;
}

URL yra palyginti su stiliaus lapu ir turėtų nukreipti į aplanką, kuriame yra jūsų vaizdas. Tokiu atveju vaizdas būtų tame pačiame aplanke kaip ir css ir html failai. Jei įdėsite savo vaizdus į atskirą aplanką, įtrauksite ir tai: url (images / imagename.jpg)

Žymeklio padėtys



Taip pat galite tinkinti žymeklių padėtį. Aukščiau pateiktame pavyzdyje išorinė ypatybė verčia kulką pasirodyti už turinio srities.
sąrašo stiliaus padėtis: viduje leidžia kulka turinio srityje, kad ji patektų į sąrašo turinį.

Trumpinimo technika



Kitas greitas būdas suformatuoti sąrašą naudojant CSS yra sutrumpinimo technika. Taikant šį metodą visos sąrašo savybės nurodomos vienoje nuosavybėje:

ul
{
sąrašo stilius: apskritimo URL („image.gif“);
}

naudojant sutrumpintą metodą, visos vertės turi būti nurodytos tokia tvarka:

sąrašo stiliaus tipas
sąrašo stiliaus padėtis (viduje, išorėje)
sąrašo stiliaus įvaizdis

Nesvarbu, ar praleisite vertę, jei kiti išliks teisinga tvarka.

Individualizuoti sąrašai yra labai naudingi, o CSS juos lengvai sukuria. Paprasta informacija paverčia vidutines svetaines geriausiomis svetainėmis.


Vaizdo Instrukcijos: Web Development - Computer Science for Business Leaders 2016 (Kovo 2024).