1 00:00:00,000 --> 00:00:00,300 2 00:00:00,300 --> 00:00:04,840 >> ALTAVEU: Així que en realitat no és la millor dissenyar entremesclar CSS amb HTML. 3 00:00:04,840 --> 00:00:08,700 Més aviat, el millor és factoritzar seva CSS, posar-lo en algun lloc central, i 4 00:00:08,700 --> 00:00:11,430 d'alguna manera aplicar-lo a la tags a la seva pàgina web. 5 00:00:11,430 --> 00:00:15,290 Per aconseguir això, podem deixar de realitat utilitzant l'atribut d'estil i en el seu lloc 6 00:00:15,290 --> 00:00:19,290 utilitzar una etiqueta d'estil, que pertany al cap d'una pàgina web juntament amb, per 7 00:00:19,290 --> 00:00:20,700 exemple, el seu títol. 8 00:00:20,700 --> 00:00:24,400 >> Anem a donar-li una oportunitat i tornar a posar en pràctica una pàgina principal per a John Harvard 9 00:00:24,400 --> 00:00:26,410 usant l'etiqueta d'estil. 10 00:00:26,410 --> 00:00:28,930 Ja he rebut puguem començar aquí amb tres divs per 11 00:00:28,930 --> 00:00:30,260 La pàgina web de John Harvard. 12 00:00:30,260 --> 00:00:33,990 Però primer anem a anar ara fins a aquesta primera div i afegir un nou atribut, 13 00:00:33,990 --> 00:00:38,680 és a dir, la identificació, i especificar que un únic identificador per aquest div particular, 14 00:00:38,680 --> 00:00:42,390 haurà de ser, per exemple, entre cometes "Top", un nom arbitrari, però 15 00:00:42,390 --> 00:00:45,840 descriptiva que aquest és div de fet en la part superior de la meva pàgina. 16 00:00:45,840 --> 00:00:48,920 >> Per a la propera div, anem a donar-li un ID diferent de, entre cometes 17 00:00:48,920 --> 00:00:54,080 "Mitjà", i donarem el tercer div un ID d'cometes "de baix". Nosaltres 18 00:00:54,080 --> 00:00:57,740 Ara té tres identificador únic a la qual es pot aplicar una mica de CSS 19 00:00:57,740 --> 00:01:01,210 propietats, però primer, anem a devolució al capdavant d'aquesta pàgina. 20 00:01:01,210 --> 00:01:04,760 Just per sobre del títol aquí, vaig a seguir endavant i definir l'estil 21 00:01:04,760 --> 00:01:07,120 i tancament l'estil. 22 00:01:07,120 --> 00:01:10,340 >> A l'interior d'aquest moment, vaig a definir algunes propietats d'estil CSS, és a dir, la 23 00:01:10,340 --> 00:01:14,550 mateixos que tenia anteriorment en Estil atributs, però aquí estaran 24 00:01:14,550 --> 00:01:16,320 definit centralment. 25 00:01:16,320 --> 00:01:20,880 Per a això, vaig a especificar la lliura símbol seguit per la part superior, de manera que 26 00:01:20,880 --> 00:01:24,710 especificant que el següent CSS propietats s'han d'aplicar a qualsevol 27 00:01:24,710 --> 00:01:28,800 Element HTML té l'única identificador de la part superior. 28 00:01:28,800 --> 00:01:32,240 Llavors vaig a tenir algunes obertes i claus tancades, i jo vaig a 29 00:01:32,240 --> 00:01:39,170 especificar, per exemple, mida de la lletra serà de 36 píxels, el pes de la font ha de ser audaç. 30 00:01:39,170 --> 00:01:41,810 >> Per mantenir les coses netes, estic posant cada d'aquestes propietats ara en la seva pròpia 31 00:01:41,810 --> 00:01:44,610 línia, però això és només una convenció estilística. 32 00:01:44,610 --> 00:01:47,830 A sota d'això, ara definirem un altre selector, per dir-ho. 33 00:01:47,830 --> 00:01:52,680 Aquesta és per a l'etiqueta HTML que té identificador únic del medi. 34 00:01:52,680 --> 00:01:57,540 I aquí, anem a especificar una mida de font de 24 píxels, per sota de l'altra 35 00:01:57,540 --> 00:02:01,520 selector per la part inferior, ia l'interior d'això, anem a especificar un 36 00:02:01,520 --> 00:02:03,850 mida de font de 12 píxels. 37 00:02:03,850 --> 00:02:09,350 >> Ara anem a guardar, canviar els permisos en, i carregar aquesta pàgina en un navegador, 38 00:02:09,350 --> 00:02:14,230 chmod un plus r css-1.html. 39 00:02:14,230 --> 00:02:22,260 Obrirem Chrome i visitar http://localhost/css-1.html. 40 00:02:22,260 --> 00:02:22,960 No està malament. 41 00:02:22,960 --> 00:02:26,930 Exactament com era la meva intenció, però m'agradaria prendre les coses un pas més enllà i ara 42 00:02:26,930 --> 00:02:29,050 text del centre John Harvard. 43 00:02:29,050 --> 00:02:32,080 Ara bé, per fer-ho, jo podria embolicar la pàgina sencera en un div com jo 44 00:02:32,080 --> 00:02:33,800 va fer un exemple anterior. 45 00:02:33,800 --> 00:02:37,820 O puc ser més intel · ligent i adonar-se que tots aquests divs es troben dins 46 00:02:37,820 --> 00:02:42,420 el cos de la meva pàgina, així que per què no s'apliquen una o més propietats de CSS per al cos 47 00:02:42,420 --> 00:02:43,850 etiquetar a si mateix? 48 00:02:43,850 --> 00:02:45,460 >> Per a això, farem això. 49 00:02:45,460 --> 00:02:47,650 Tornem a gedit aquí. 50 00:02:47,650 --> 00:02:52,460 Anem a retrocedir fins l'etiqueta d'estil, i anem a especificar un selector només 51 00:02:52,460 --> 00:02:54,520 usant el nom d'aquesta etiqueta, Cos. 52 00:02:54,520 --> 00:03:00,580 A sota d'això, posarem les nostres claus seguit pel centre de text-align. 53 00:03:00,580 --> 00:03:05,580 Ara anem a desar la pàgina i torna a carregar dins d'aquest navegador. 54 00:03:05,580 --> 00:03:08,090 Recarregar a Chrome, i voila. 55 00:03:08,090 --> 00:03:11,000 Ara tenim la pàgina de John Harvard centrada ja que teníem intenció. 56 00:03:11,000 --> 00:03:12,619