Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 78 - Demo
P. 78

                                        Nxënësi/ja: Aktivitet:3.5 Prezantimi i CSS-sëNëse HTML ndërton strukturën e dokumentit, CSS (Cascading Style Sheets) synon vetëm paraqitjen e secilit element të strukturës. Në këtë mënyrë, struktura dhe paraqitja janë të ndara. CSS është një gjuhë stilizuese, që formaton dokumentet në HTML. Nëpërmjet formatimit mund të zgjidhni madhësinë e shkrimit, ngjyrën, llojin e shkrimit, pozicionin etj. Për të futur kodin CSS në një faqe html kemi tri mundësi:1. Stilizimi në një rresht. Ky stilizim realizohet duke vendosur atributin “style” në elementin HTML. Brenda atributit “style” përcaktohen edhe karakteristikat CSS. Kodi CSS vendoset te elementi html (fig. 1).2. Stilizimi i brendshëm. Në këtë stilizim, elementi “style” vendoset brenda tag-ut  në dokumentin HTML. Kodi CSS vendoset në fillim të faqes html (fig. 2).3. Stilizimi i jashtëm ruan kodin CSS në një dokument.css jashtë dokumentit HTML. Për të vendosur kodin CSS përdoret tag-u , i cili vendoset brenda tag-ut . Ky stilizim zakonisht përdoret kur stili do të ndryshohet në disa faqe. Kodi css vendoset në një skedar të pavarur, jashtë skedarit HTML (fig.3).HTML dhe CSS njeh mënyrat e ndërfutjes së elementeve CSS në dokumentin HTML; mëson si të shtojë skedarë të tipit CSS në DreamWeaver;Hapni programin Notepad++ dhe krijoni një skedar të ri të quajtur csstekst. Për sa i përket prapashtesës, sigurohuni të zgjidhni CSS (Cascading Style Sheets). Në të njëjtën direktori krijoni një skedar html.Skedari CSS do të shërbejë për të formatuar elementet e faqes html. Hapat përkatës do të shpjegohen në vijim. Aktivitet:Fig. 1Fig. 2Fig. 3Ky mësim këshillohet të zhvillohet në laborator dhe mund t’u shërbejë nxënësve për të plotësuar portofolin. Këshilla Shkruani kodin e mëposhtëm në CSS në një skedar dhe ruajeni atë me emrin dokCSS1.ccsbody { background-color:#d0e4fe;}h1 {    color: orange;    text-align: center;}p {    font-family: “Times New Roman”;    font-size: 20px;}76

| 72 73 74 75 76 77 78 79 80 81 82 |