Kuinka Suunnitella Verkkosivustomalli Uudelleen

Sisällysluettelo:

Kuinka Suunnitella Verkkosivustomalli Uudelleen
Kuinka Suunnitella Verkkosivustomalli Uudelleen

Video: Kuinka Suunnitella Verkkosivustomalli Uudelleen

Video: Kuinka Suunnitella Verkkosivustomalli Uudelleen
Video: Теплый, уютный и очень удобный женский кардиган на пуговицах спицами! Расчет на любой размер! Часть1 2024, Saattaa
Anonim

Helpoin tapa luoda verkkosivusto on käyttää mallia. Resurssin erottamiseksi sinun on kuitenkin vaihdettava oletusasettelu. Ja tässä et voi tehdä ilman HTML- ja css-perustietoja.

Kuinka suunnitella verkkosivustomalli uudelleen
Kuinka suunnitella verkkosivustomalli uudelleen

Ohjeet

Vaihe 1

Etsi Internetistä sinulle parhaiten sopiva verkkosivustomalli. Kiinnitä huomiota sen ominaisuuksiin, kykyyn sopeutua näytön kokoon, valikon ominaisuuksiin ja sarakkeiden asetteluun. Lataa haluamasi versio tietokoneellesi, pura arkisto pakkauksesta. Tarkista sen suorituskyky lataamalla tiedostot sivuston juuriin. Ehkä malli sisältää virheitä eikä sitä asenneta oikein, silloin ei ole mitään järkeä työskennellä sen kanssa tulevaisuudessa.

Vaihe 2

Vaikka et aio tehdä mallia kokonaan uudelleen, korvaa suurin osa kuvista, etenkin ne, jotka sijaitsevat logona. Korvaa kukin kuva tällä tavalla:

- avaa graafinen tiedosto Photoshop-ohjelmassa

- valikossa "Kuva" - "Kuvan koko" tarkastele sen parametreja;

- avaa uusi täsmälleen samat mitat;

- luo haluttu kuva sovellustyökaluilla;

- litistä kaikki tasot ja tallenna uusi kuva (ei verkkoon) samalla nimellä ja samaan kansioon asettamalla alkuperäinen muoto.

Siten yhden kuvan sijaan pitäisi näkyä toinen.

Vaihe 3

Heti kun vaihdat kaikki kuvat, zip-kansio tiedostoineen (Joomlan tapauksessa) ja lataa se sivuston hallintapaneelin kautta "Laajennukset" -valikossa. Katso, näytetäänkö teema oikein uusien kuvien kanssa.

Vaihe 4

Muuta loput parametrista style.css. Lisäksi on paljon helpompaa tehdä tämä ei hallintapaneelin kautta, vaan tietokoneella. On järkevää käyttää localhostia (Denver) nähdäksesi muunnosten tulokset mahdollisimman pian. Näin vältetään tarve ladata tulos palvelimelle joka kerta, jotta tuloksia voidaan tarkastella seuraavan muokkauksen jälkeen.

Vaihe 5

Lataa ilmainen FireBug-laajennus Mozilla Firefoxille. Asennuksen jälkeen selaimen oikeaan yläkulmaan ilmestyy keltainen vikakuvake. Napsauta sitä tai paina F12-näppäintä ja ruudun alaosassa sivukoodi näkyy tiivistetyssä versiossa. Se voidaan avata viemällä hiiri plusmerkkien päälle. Ja jos napsautat elementin riviä, se korostetaan ruudun yläosassa. Koodin sisältävän ikkunan oikealta puolelta löydät tyylit, jotka osoittavat ulkonäöstä vastaavat rivit. Ja heti tulee selväksi, missä sinun on muokattava tyylitiedostoa muotoilun muuttamiseksi.

Vaihe 6

Avaa style.css Notepad ++ -sovelluksessa. Voit käyttää muita ohjelmia, jotka on suunniteltu muokkaamaan koodia, mutta tähän tarkoitukseen et voi käyttää vakiomuotoista Muistioa, muuten koodauksesta johtuu virheitä. Etsi muutettavat parametrit FireBugin avulla ja muokkaa niitä samanaikaisesti Notepad ++ -sovelluksessa.

Vaihe 7

Tallenna lopullinen css ja lataa tiedosto palvelimelle.

Suositeltava: