Étape 3: Conteneur de texte corps principal
#top_section {float : left ; width : 960px ; padding : 30px 17px 15px 17px}
#top_section h2 {polices-taille : 30px ; line-height : 20px ; color: #484747 ; font-family: « MyriadPro-Regular »; padding: 0 17px 0 0 ; police-poids : normal ; text-transform : majuscules}
#top_section durée de h2 {color: #80b439}
#top_section p {font-size : 16px ; ligne-height : 20px ; color: #484747 ; famille de polices: « MyriadPro-Regular »; padding-bas : 15px}
#top_section .van_img {float : right ; margin: 0 0 0 11px}
#top_section .house_img {float : left ; margin: 0 15px 0 0}
Molok corps principal, définissez-la via son id, c'est-à-dire, body_container et faire flotter à gauche, définissez sa largeur à 994 pixels, marge du haut à 5 pixels et définir son code couleur noir. Si vous vous êtes souvenu il correctement, nous avons divisé ce conteneur en deux section c'est-à-dire, section et en bas partie supérieure, dont nous traiterons ensuite. Donc pour l’instant, déclarer la partie supérieure et la faire flotter à gauche, définissez sa largeur à 960 pixels et remplissage à 30 17 15 17 pixels du haut à gauche. Maintenant, définissez la taille de la police, hauteur de la ligne, code couleur, famille de polices, rembourrage, font-weight et text-transform pour le titre de la partie supérieure. Définissez ensuite la balise span que nous introduit dans la balise h2 et définir son code couleur. Aller de l’avant, définir la balise de paragraphe, définir sa taille de la police, hauteur de la ligne, couleur, famille de polices et remplissage par le bas. Puis définir les deux images à l’intérieur de la css et faire flotter à droite et définir leur marge en conséquence.
Le conteneur de fond
#bottom_container {float : left ; width : 994px ; background: #d1dde1 ; padding : 25px 0 0 0}
#bottom_container .common_box {float : left ; width : 237px ; margin-droit : 52px}
#bottom_container. common_box.second {width : 260px;}
#bottom_container .common_box h3 {police-size : 18px ; ligne-hauteur : 14px ; color: #27a9e1 ; font-family: « Avante »; padding-bas : 12px}
#bottom_container .common_box p {font-taille : 12px ; ligne-height : 18px ; color: #136589 ; font-family: "MyriadPro-Regular";}
#bottom_container .common_box p.last {color: #27a9e1}
#bottom_container .common_box .name {float : right ; text-decoration : none ; font-size : 12px ; line-height : 18px ; color: #27a9e1 ; margin-haut : 27px}
#bottom_container .common_box .contact {float : left ; width : 100 %; liste-style : none ; padding : 10px 0 0 0}
#bottom_container .common_box .contact li {float : left ; width : 100 %; font-size : 12px ; line-height : 18px ; color: #27a9e1}
#bottom_container .common_box .contact li un {float : left ; text-decoration : none ; color: #27a9e1}
#bottom_container .common_box .contact li a: hover {text-decoration : underline}
#bottom_container .common_box .contact li span {float : left ; color: #2d2d2d ; largeur : 72px}
Maintenant à l’aide de l’id de la balise de la section pour le conteneur de fond, faire flotter à gauche, sa largeur de 994px, définir sa couleur d’arrière-plan et définir le remplissage. Puis déclarez la classe de boîte commune, faire flotter à gauche et définir la largeur et la marge de la droite après avoir mesuré à partir du fichier PSD. Après cela, définir la deuxième boîte commune et définir sa largeur. Comme nous avons maintenant mis les deux cases requises, maintenant définir le font-size, line-height, code couleur, famille de polices et remplissage par le bas pour le titre. Répétez cette opération pour la balise de paragraphe aussi et dans la ligne suivante définit le code de couleur pour la balise de paragraphe avec une classe de dernière.
Aller de l’avant, déclarez la balise avec une classe du nom et réglez-le à flotter vers la droite, de text-decoration Gardez-le voix contre zéro et à sa taille de la police, hauteur de la ligne, codes couleur et marge du haut en conséquence. Dans l’étape suivante, définir la balise avec une classe de contact, l’étiquette de liste à l’intérieur, l’effet de tag et de vol stationnaire d’ancre et enfin la balise span selon la condition.
