Cum să apăsați subsolul site-ului în partea de jos a paginii, cum să plasați blocul în centrul paginii, studio de design

Contactele noastre: +7 (928) 029 69 59. +7 (909) 493 69 59

Cele mai recente lucrări privind crearea și promovarea site-urilor noastre WEB studio din Stavropol, Cherkessk și Pyatigorsk

Cum să apăsați subsolul site-ului în partea de jos a paginii, cum să plasați blocul în centrul paginii, studio de design







Folosiți corect stilurile CSS. Cum să apăsați corect subsolul în partea de jos a paginii și cum să aranjați blocul în centru.

De multe ori, atunci când crearea de site-uri din Cherkessk Stavropol și este necesar să se aplice anumite tehnologii CSS pentru punerea în aplicare a acestor sarcini. De exemplu, se întâmplă că aveți nevoie pe pagina cu o cantitate mică de conținut pentru a stoarce subsol (subsol) a site-ului în partea de jos a paginii, localizați unitatea la centrul ecranului și așa mai departe. Există mai multe moduri de a rezolva aceste probleme, dar nu toate dintre ele sunt compatibilitate valabile și cross-browser. În acest articol, vom examina modalitățile prin care puteți rezolva aceste sarcini într-un mod valabil și încrucișat.

Proprietatea "min-height" pentru browserele mai vechi.

În scopul de a „face“ browsere mai vechi să înțeleagă proprietatea de «min înălțime», pur și simplu alocați blocul la care dorim să stabilească o înălțime minimă de 100%, următoarele stiluri:

Cum să apăsați corect subsolul în partea de jos a paginii.

Creați un fișier HTML cu următorul cod:

Acum, să ne uităm la ceea ce este. În documentul HTML, am creat trei blocuri cu id "document", "aux" și "subsol". Să ne uităm la fiecare bloc.







Blocul "document" are o margine negativă în partea inferioară, egală cu înălțimea blocului "subsol". Folosind metoda de stabilire a proprietății "min-height" descrisă mai sus, setăm înălțimea minimă la 100%.

Datorită faptului că "footerul" este în afara blocului "document", browserele îl vor afișa în partea de jos a paginii.

Block „aux“ este, de asemenea, egală cu înălțimea site-ului subsol, și servește pentru a preveni ca „suprapunere“ un conținut de site-ul subsol în cazul în care este mai mare decât înălțimea ferestrei browser-ului.

Cum să aranjați blocul în centru utilizând CSS.

Adesea, atunci când creați un site, trebuie să organizați un div sau alt element în centrul ecranului. Dacă este o aliniere orizontală în centru, atunci acest lucru nu cauzează dificultăți, doar atribuiți următoarele blocuri următoarele stiluri CSS:

Folosind aceste stiluri CSS atribuite blocului, blocul este aliniat orizontal în centru. Să ne uităm la modul de aliniere a blocului în centru și pe verticală. Această metodă este utilizată atunci când este necesar să se centreze un bloc de dimensiune fixă, adică când lățimea și înălțimea blocului sunt cunoscute. Să examinăm HTML și CSS:

Acum, să examinăm codul CSS detaliat. Am setat blocul la o înălțime egală cu 200px și o lățime egală cu 300px și am folosit pentru acest bloc poziționarea absolută la 50% din partea superioară și 50% din stânga. Apoi, setăm o marjă negativă la marginea egală cu jumătate din înălțimea blocului centralizat și o indentare negativă în stânga, egală cu jumătate din lățimea blocului nostru.

Acum puteți verifica rezultatul în orice browser, unitatea noastră va fi localizată exact în centrul ecranului.

Dacă trebuie să modificați lățimea sau înălțimea blocului, nu uitați să schimbați atât valorile margine, cât și marginea-stânga. stabilindu-le egal cu jumătate din înălțimea și lățimea blocului respectiv.

Rubber site cu trei coloane.

Adesea, atunci când creați un site web, trebuie să faceți un site de aspect cu trei coloane din cauciuc. care ar ocupa întreaga lățime a ferestrei browserului. În practica noastră, folosim următoarea metodă pentru a crea un aspect al site-ului de cauciuc. care este valid și cross-browser:

Despre studioul WEB DigitalART

Web Design Studio DigitalART

Studioul nostru oferă servicii pentru crearea și promovarea site-urilor către organizațiile și întreprinderile din Stavropol. Pyatigorsk și Cherkessk.

Contactați-ne pentru informații:







Trimiteți-le prietenilor: