| groawn | Datums: Sestdiena, 2012-02-18, 4:40 PM | Numurs # 1 |
|
Pakāpe: Moderators
Entries: 7
|
| Šajā apmācība mēs aptvers pamatus CSS un redzēt, kā tas izskatās praksē. Ja jūs nezināt, ko jūs vēlaties, CSS un kāpēc tie tiek izmantoti, lai izveidotu mājas lapas, es ieteiktu jums izlasīt nodarbību Kas ir CSS.
Tagad, kad esat nolēmis apgūt pamatus CSS tad jūs droši vien jau zināt, ka HTML veido tagiem, katrs pēc noklusējuma tag, parāda tā saturu (kas ir ielikta starp tagiem) noteiktā veidā, proti, tai ir zināma stils . Izmantojot CSS, mēs varam mainīt stilu un sniegt konkrētu objektu šāda veida, kas mums ir nepieciešams.
Aprakstu par dažādiem stiliem elementiem ir starp tagiem . Ļoti veids rakstīšanas CSS nav, piemēram, ieceļošanas frāzi HTML. Piešķiršanu īpašumā vai kāda elementa tiek darīts, izmantojot šādus ierakstus:
pārslēgs {īpašums: vērtība;}
Kur selektors ir tag, klases, vai identifikators, ko mēs gribam uzdot dažus rekvizītus, īpašums ir īpašums taga mēs vēlamies, lai mainītu šo vērtību un vērtību, kuras, mēs vēlamies piešķirt šo īpašumu.
Īpašumu un vērtību ir rakstīts iekavās pēc īpašums ir resnās zarnas, un pēc vērtības semikolu. Visās pārējās CSS nav reģistrjutīga, nodošanas līnijas, trūkumus, ti, ļoti ierakstu jūs varat darīt, kā redzat fit.
Lūk, piemērs, kuru jūs varat redzēt, kā tas darbojas praksē. Šajā piemērā, izmantojot CSS iestatiet teksta krāsu. Izveidot HTML kodu no šīs lapas. Lai to izdarītu, kopējiet kodu, ielīmējiet to teksta redaktoru "Notepad", un pēc tam atveriet izvēlni postenī "File" >> "Save as ..." un saglabājiet failu ar paplašinājumu Html tam. Atvērtu saglabāto failu ar jūsu pārlūks, un jūs redzēsiet, ka teksts ir zilā krāsā.
Code <html> <head> <title> manas pirmās lapas, izmantojot CSS </ Nosaukums> <STYLE> p {color: # 330.099;} </ style> </ head> <body> piemērs, izmantojot CSS, lai izstrādātu tekstu </ p > </ body> </ HTML>
Lūk, ko jums vajadzētu būt iespējai:
[/c]$ IMAGE1 $
Lūdzu, ņemiet vērā, ka no šajā html kodā novietota starp tagiem un tag ka būs īpašums p stilu apraksts rakstīts bez iekavām. Turklāt, mēs varam paplašināt īpašības mūsu p tagu un noteikt mūsu teksts ir ne tikai krāsu, bet arī apjoms un fons utt
Pievienot rekvizītus, kas ir pieejamas kodu zemāk (vai vienkārši nomainīt veco kodu ar kodu iegulto zemāk), un redzēt, kas notiek ar jūsu tekstu.
Code <html> <head> <title> manas pirmās lapas, izmantojot CSS </ Nosaukums> <STYLE> p {color: # 330.099; fona krāsu: # FFFF99, font: 14px Verdana, Arial, Helvetica, sans-serif;} </ style> </ head> <body> piemērs, izmantojot CSS, lai izstrādātu tekstu </ p> </ body> </ HTML>
Rezultāts būs šādi:
$ IMAGE2 $
Ir trīs veidi, kā lietot stilu, iepriekš minētās divas lietas mums ir uzskatāms iespēju, kad no stila apraksts ir html failu un atrodas augšā starp tagiem.
Turklāt stilu aprakstu var atrasties html kodu. Piemēram, izveidot tādu pašu stilu tagu p, tikai mainīt teksta lielumu un krāsu. Šajā gadījumā kods būtu jāizskatās:
Code <p Style="color: #009900; background-color:#FFFF99; font:18px Verdana, Arial, Helvetica, sans-serif;"> 2. piemērs, izmantojot CSS, lai izstrādātu tekstu </ P>
Nokopējiet un ielīmējiet to jebkur starp tagiem. Mēs iegūtu šādu:
$ IMAGE3 $
Lūdzu, ņemiet vērā, ka mēs esam jau aicināja stila tagu
un loģika jebkurā lappuses vietā, mēs izmantosim tagu
tam jābūt ietvertam, kā mēs iepriekš plānota. Tomēr, pārlūkprogramma vienmēr dod priekšroku stilu, kas mums lika tieši html kodu pirms teksta. Tāpēc, otrajā gadījumā, jūs varat redzēt, ka krāsu un lielumu teksta ir mainījusies.
Un 3. veids, kā izmantot šo stilu, kad viņš izturēt atsevišķā failā un HTML kodu atstāt tikai saiti uz šo failu. Šī metode ir labāka, jo, kad jūs to izmantot lapa nav piekrauts ar nevajadzīgu kodu, un ja jums nepieciešams mainīt izskatu neviena elementa, tad tas būs pietiekami, lai mainītu stilu ar CSS failu, un šīs izmaiņas parādās visās lapās, kuras ir saistītas šis fails.
Lai redzētu, kā tas darbojas, rīkojieties šādi: tajā pašā mapē, kur ir tava lapa, mēs izveidojām iepriekš, izveidot teksta dokumentu, un pēc tam no koda iepriekš mēs izveidojām lapu, samazinājums, kas atrodas starp tagu un ielīmējiet to jaunizveidoto teksta dokumentu un pēc tam saglabājiet to ar nosaukumu stilu un paplašināšanu. css. Pašu tagi ar HTML dokumentā, izdzēst un tā vietā ievietot šo kodu:
Code <link rel="stylesheet" href= "style.css">
Šis kods ir saite uz jūsu css failā, uz kuru pārlūkprogramma parādīs savu stilu un lapas saturu atbilstoši. Ja jūs to labi, tad jums vajadzētu saņemt divus failus guļ tajā pašā mapē, viens ar paplašinājumu html un ietver kodu.:
Code <html> <head> <title> manas pirmās lapas, izmantojot CSS </ Title> <link rel="stylesheet" href= "style.css"> </ head> <body> piemērs, izmantojot CSS dizaina teksta / p < > </ body> </ HTML>
Un 2. style.css fails, kas satur stilus, kods izskatās šādi:
Code lpp {color: # 330.099; Fona-color: # FFFF99; fonts: 14px Verdana, Arial, Helvetica, sans-serif;}
Tad palaist html lapas, un jūs redzēsiet to pašu dizainu ar tekstu kā agrāk, bet tagad tas tiek ņemts no atsevišķu failu style.css. Jaunāko stilu, kad viņi pārcēlās uz atsevišķā failā ir ērtākais un vēlamo.
Tāpēc, ka visbiežāk izmanto šo metodi, veidojot mājas lapas. Ka viss ir aktuāls pamati CSS. Plašāku informāciju par to, kā izmantot stilus noformēt lapas, redzētu pārējās stundas par CSS.
|
| |
| |