V brskalniku Chrome odprite poljubno spletno stran.
Pregledovanje elementov na strani odpremo tako, da z desnim miškinim gumbom kliknemo na poljuben element na strani ...
|
Chrome in pregled elementov |
|||
|
|||
|
|||
|
|||||
V brskalniku Chrome odprite poljubno spletno stran.
|
|||||
|
|||||
... ter v meniju izberemo možnost Preglej element. |
|||||
|
|||||
Prikaže se nam HTML koda trenutno prikazane spletne strani. |
|||||
|
|||||
Na desni strani lahko najdemo oblikovne CSS stile, ki so uporabljeni. |
|||||
|
|
|||||
Če želimo, lahko tudi spreminjamo ali dodajamo lastnosti posameznim CSS stilom. |
|||||
|
|||||
V prejšnjem koraku sem spremenil prosojnost slike (opacity) in kot opazimo, so spremembe na strani vidne takoj in ni potrebno ponovno nalaganje strani. Razvijalci spletnih strani na ta način hitro testirajo razne oblikovne možnosti in jih prenesjo v dejansko kodo šele, ko so zadovoljni z rezultatom. |
|||||
|
|||||
Če odpremo zavihek Computed, lahko vidimo točne dimenzije, ki jih zaseda posamezni element. |
|||||
|
|||||
V zavihku Network vidimo, katere dokumente je naložila spletna stran.
|
|||||
|
|||||
Za razvijalce je pomemben zavihek Sources, kjer si lahko ogledamo Javascript programsko kodo, ki se uporablja na strani. |
|||||
|
|||||
V kolikor pri določeni vrstici programske kode kliknemo ob desnem robu. Na ta način dosežemo, da se bo izvajanje funkcije na tem mestu ustavilo. S tem lahko točno preverimo, kaj se dogaja pri izvajanju funkcije. |
|||||
|
|||||
Na koncu se nahaja tudi zavihek Console. V njem se izpisujejo razne napake v Javascriptu, ki se pojavljajo na strani. Lahko pa na tem mestu tudi direktno izvajamo Javascript ukaze. |
|||||
|
|||
|
||||||||
|
||||||||