Pagrindinis » Interneto svetainės dizainas » Puikus HTML sąrašų naudojimas „Web Design“

    Puikus HTML sąrašų naudojimas „Web Design“

    Visame internete galite rasti gerai suplanuotų sąrašų. Dizaineriai juos naudoja dešimtmečius koordinuoti puslapio informaciją ir išdėstymus, ir šiuolaikiniame žiniatinklyje galite pamatyti didelį kūrybiškumą, kaip interneto dizaineriai naudoja sąrašus. Tai navigacijos meniu, profilių nuorodos, archyvai, užduotys / kontroliniai sąrašai ir kitos paskirties tonos!

    Šiame pranešime pristatysiu įvairių rūšių HTML sąrašus, pateikiant patarimus, kaip juos kurti, ypač apie tai, kaip pridėti unikalų kraštą savo sąrašui. Taip pat aš jus paimsiu keletą pavyzdžių svetainių su fantastišku sąrašų dizainu ir galiausiai gausite svetainių, kuriose yra gerai suprojektuoti HTML sąrašai, sąrašą. Nėra jokių abejonių, kaip padaryti, kad jūsų paprastieji vaizdai atrodytų unikalūs, ir pradėkime nuo jų šiandien!

    Sąrašo elementai

    Žiniatinklio dizaineriai nuolat šokinėja iš vieno bandwagon į kitą, todėl interneto svetainės stiliai laikui bėgant keičiasi, tačiau sąrašai išbandė laiką ir gali būti labai naudingi ateities naujovių diegimo pasaulyje.

    Prieš patikrindami pavyzdžius, kuriuos norėčiau aptarti su HTML sąrašais. Yra keletas skirtingų tipų sąrašų, kuriuos galite naudoti savo projektavimo darbuose. Dauguma interneto dizainerių dėmesio skiria Neregistruoti sąrašai kurios atidaromos a

      žyma, tačiau yra ir dar du mažiau populiarūs variantai: Užsakyti sąrašai ir Duomenų apibrėžtys. Toliau pateikiau daugiau informacijos.

      Neregistruoti sąrašai (
        )

      Galbūt vienas iš labiausiai naudojamų HTML4 / HTML5 standartų elementų. Neregistruoti sąrašai perduos duomenis tokiu pat būdu, kaip ir užsakytas sąrašas, tačiau jūs nepastebės jokių skaitmeninių žymeklių šone. Vietoj to kiekvienam elementui suteikiamas a mažas apskritimas arba diskas ir suskirstyti į naują eilutę. Ši piktograma taip pat galima keisti su sąrašo stiliaus ypatybe rasti CSS.

      Toliau pateikiamas neregistruoto sąrašo pavyzdinis kodas:

       
         
      • 1 punktas
        •  
      • 2 punktas
        •  
      • 3 punktas
        •

      Nereguliuojami sąrašai yra puiki priemonė pastatyti navigacijos nuorodos. Kadangi jūs galite lengvai patalpinti visus sąrašus bet kuriame sąrašo elemente tai yra paprastas dalykas sukurti sub-navigacijos nuorodas taip pat. Pašalinus sąrašo stilių, paliksite tuščią elemento elementą. Iš čia galite stiliuoti inkarų nuorodas, kad jūsų puslapyje būtų rodomi blokiniai elementai, tokiu būdu užpildydami naršymo meniu dizainą, ir su kai kuriais jQuery kodais galite sudėti gražią svetainės antraštę.

      Dažniausiai rasite neregistruotus sąrašus interneto straipsnių ar diegimo instrukcijų viduryje. Atkreipkite dėmesį „Google“ ir kiti paieškos skelbimai neveikia jūsų puslapio turinio kitaip, taip jūsų SEO neturėtų būti paveikta nepriklausomai nuo pasirinkto sąrašo tipo.

      Užsakyti sąrašai (
        )

      Kai jums reikia užsisakyti duomenų rinkinį, galite sukurti savo išdėstymo sistemą nuo nulio, tačiau tokiu būdu jums reikės pridėti kiekvieną didinimo numerį ranka, o tai gali būti varginantis. Užsakyti sąrašai puikiai tinka išlaikyti numeruotas užduotis be jokių varžtų. Vidaus sąrašo elementų tvarka (

    • ) diktuos, kaip duomenys pateikiami.

      Žemiau pateikiamas užsakyto sąrašo kodas:

       
         
      1. 1 punktas
        2.  
      2. 2 punktas
        3.  
      3. 3 punktas
        4.

      Tai taip pat įmanoma keisti skaitiklį nuo įprastų numerių į kelias kitas parinktis. Jie apima abėcėlės raidės ir romėnų skaitmenys, Išvardyti kelis. Žiniatinklio dizaineriai naudotų užsakymų sąrašą konkrečiam turiniui. Receptų duomenys, Dienos užduotys, parankiniai, arba viršuje / neseniai prisijungęs vartotojai tik keletas pavyzdžių. Dažnai pamatysite dienoraščio komentarai pastatytas naudojant užsakytus sąrašus, kad kiekvienas komentaras būtų sunumeruotas.

      Duomenų apibrėžimų sąrašai (
      )

      Apibrėžimų sąrašai nebėra labai dažnai matomi (ne taip, kaip jie buvo populiarūs). Jie buvo matomi su interneto dizaineriais, kuriant sudėtingus nuorodų ar dėžutės turinio formatus. The duomenų sąrašo žyma (

      ) šiandien koduotojai dažnai nesupranta. HTML4.01 specifikacijose buvo naudojami duomenų sąrašai suporuoti elementus su jų aprašymais. Jie buvo vadinami apibrėžimų sąrašais.

      Žemiau pateikiamas duomenų apibrėžimo sąrašo kodas:

       
       
      1 punktas
       
      apibūdinimas
       
      2 punktas
       
      apibūdinimas
       
      3 punktas
       
      apibūdinimas

      Tačiau su naujomis HTML5 specifikacijomis duomenų sąrašai buvo transkribuoti. Nėra jokių skirtumų tarp sintaksės elementų naudojimo, tačiau jų paskirtis buvo atnaujinta kaip a aprašymo sąrašą, kurį sudaro viena ar daugiau duomenų \ t

      ), po kurio yra vienas ar keli duomenų apibrėžimai (
      ).

      Stiprus HTML5 daktaro straipsnio pavyzdys yra a metaduomenų formato sąrašas. Viduje vienas dl sąrašo elementas apibrėžti terminą, pvz., jūsų vardas, po to kiekvienas kitas apibrėžimas gali apibūdinti duomenis apie jus, galbūt jūsų amžių, okupaciją, dabartinį miestą ir pan. Galiausiai bet koks duomenų rinkinys su raktų / verčių poromis puikiai tinka aprašų sąraše. Sąraše galite naudoti daugiau nei vieną duomenų terminą, tačiau W3C nurodo kiekvienas terminas turi būti unikalus sąraše.

      Dabar, kai priartėjome 3 populiariausius sąrašo stilius, pereikime prie kai kurių pavyzdžių! Žiniatinklio dizaineriai per pastaruosius kelerius metus gavo labai kūrybingus sąrašus. Toliau išvardijau 7 mano mėgstamiausias svetaines, ypatingą dėmesį skiriant jų kūrybiniam sąrašų naudojimui.

      Paprastas Neregistruotas sąrašas Navigacija

      Navigaciniai meniu yra daug paprastesni kurti su šiuolaikinėmis CSS technologijomis. Štai kodėl netvarkingi sąrašai ir netgi užsakyti sąrašai tapo populiariu pasirinkimu. Vienas iš mano mėgstamiausių pavyzdžių pasirodo socialinės žiniasklaidos dienoraštyje „Mashable“.

      Viršutinės antraštės link rasite 2 pagrindinius nuorodų rinkinius. Tiesioginis jų logotipo viršuje yra nedidelis neregistruotas sąrašas, kuriame yra bendruomenės nuorodos, pvz., „Top Stories“, „Trending Topics“ ir „People“. Dizaineris sukūrė aptakų stilių, kuriame yra tvirtas fonas ir spalvų schema.

      Tiesiogiai po juo matysite jų sub navigacijos nuorodas. Šis navigacijos meniu veda į tinklaraščių kategorijas, pvz., „Social Media“ arba „Tech“. Abu neįrašyti sąrašai yra a HTML5

    Kitas straipsnis
    Atgal į „Apple TV Remote“ „D-Pad“
    Ankstesnis straipsnis
    Briliantinės idėjos ir tendencijos, susijusios su „Feature Post“ valdikliais
    © Savtec
    Naudinga informacija ir interneto svetainių kūrimo patarimai. Programavimas, interneto dizainas, CSS, HTML, JAVASCRIPT. Konfigūruokite ir iš naujo įdiekite „Windows“. Svetainių ir programų kūrimas nuo nulio.