desenvolvimento para web - xhtml, css, padrões da web, usabilidade, acessibilidade, web design, SEO, blogs e tecnologias para desenvolver a web In via di sviluppo web - XHTML, CSS, standard web, usabilità, l'accessibilità, web design, SEO, blog e della tecnologia per sviluppare il web

Folhas de estilo vieram para facilitar a vida de desenvolvedores web , quanto a isso não há dúvidas. Fogli di stile è venuto a facilitare la vita degli sviluppatori web, in quanto non vi è alcun dubbio. Dúvidas, mesmo, são em relação a algumas técnicas CSS para alcançar determinados posicionamentos e resultados como, por exemplo, como deixar um site sempre no centro usando as folhas de estilo. Domande, anche, alcuni sono in materia di tecniche di CSS per raggiungere certe posizioni e risultati, come ad esempio il modo di lasciare un sito in cui il centro utilizzando i fogli di stile. Pode parecer que é algo complicado de fazer e/ou que se trata de uma técnica CSS mais complexa; para a felicidade de quem mexe com CSS, tanto novatos quanto veteranos, colocar um site sempre no meio com as folhas de estilo em cascata é simples de ser feito. Può sembrare che qualcosa è complicato per effettuare e / o che si tratta di una tecnica più complessa CSS, per la felicità di coloro che flinch con i CSS, sia i principianti che i veterani come, mette sempre un sito a metà con il fogli di stile è semplice da fare.

Tão simples que, na verdade, existem diversas maneiras de se centralizar um site em qualquer resolução de tela usando CSS. Così semplice che, effettivamente, ci sono diversi modi per centralizzare un sito in qualsiasi risoluzione dello schermo utilizzando CSS. São técnicas variadas, que, quando aplicadas, produzem o mesmo efeito esperado - de centralizar uma página web ou site completo. Tecniche sono molteplici, che, una volta attuati, producono lo stesso effetto previsto - di centralizzare o una pagina web sito completo. Como todas as técnicas servem para a mesma coisa, fica “a gosto do freguês” escolher qual utilizar. Come tutte le tecniche utilizzate per la stessa cosa, è "il gusto del cliente lascia" scegliere quale utilizzare.

Centralizar site com CSS: posicionamento relativo e margens automáticas Centro sito con i CSS: posizionamento e relativi margini automatico

Esta é uma das mais simples técnicas para alcançar o efeito de o site ficar sempre no centro, independentemente da resolução de tela do visitante. Questo è uno dei più semplici tecniche per conseguire l'effetto di sito essere sempre al centro, indipendentemente dalla risoluzione dello schermo per il visitatore.

Basicamente, deve haver uma div principal, que “englobará” o restante das divs do site . Fondamentalmente, non vi dovrebbe essere un importante spaccati, che "coprire" il resto del divs sito. Geralmente os desenvolvedores costumam denominá-la “wrap”, “principal”, “site”, “all” ou algum outro nome que designe que esta é a div “externa” do site; a “casca” que está sempre ao centro. Di solito sviluppatori di solito denominá "a capo", "principale", "sito", "tutti" o qualche altro nome che indica che questo è il div "esterno" del sito, il "guscio" che è sempre al centro. Como as outras divs ficam como sendo descendentes, a “mágica” acontece. Come sono le altre divs come discendenti, la "magia" succede.

 #wrap { width : 750px ; /* largura fictícia */ margin : 0 auto ; } # Wrap (width: 750px; / * * larghezza fittizia / margin: 0 auto;) 

Para quem não sabe, a declaração de margin indica que as margens superior e inferior serão “0″ e as margens esquerda e direita serão calculadas automaticamente; ou seja, o site fica centralizado! Per coloro che non sanno, la dichiarazione di margine indica che il superiore e inferiore margini sarà "0" e la sinistra e destra margini sono calcolati automaticamente; cioè, il sito è centrato!

Centralizar site com CSS: posicionamento absoluto e margem esquerda negativa Centro sito con i CSS: posizionamento assoluto e la sinistra negativo

Também é possível centralizar todo um site através de posicionamento absoluto. E 'anche possibile centralizzare un intero sito attraverso il posizionamento assoluto. Para tanto, vamos utilizar a mesma div “wrap” como exemplo. Per fare ciò, useremo la stessa separate "a capo" come un esempio.

 #wrap { left : 50 % ; margin-left : -375px ; /* metade da largura fictícia */ position : absolute ; width : 750px ; } # Wrap (a sinistra: 50%; margin-left:-375px; / * la metà della larghezza fittizio * / posizione: assoluta; width: 750px;) 

Quando alguma div tem posicionamento absoluto, ela se baseia em seu elemento pai para se posicionar. Quando uno ha diviso il posizionamento assoluto, esso si basa sul suo elemento principale di posizione stessa. No caso, como ela não tem elemento pai, então vai se basear na página, em si - body . Se, come non ha alcun elemento principale, quindi vai si basa sulla pagina, di per sé - corpo. Então, para conseguir o efeito de centralização, jogamos uma margem esquerda de 50%, para que vá para o meio. Così, al fine di raggiungere l'effetto di centralizzazione, svolgere un margine sinistro del 50%, ad andare a metà. Mas é o limite da esquerda da div “wrap” que foi jogada 50% neste sentido; então, para que o centro da página é que fique no meio, aplica-se uma margem negativa da metade do valor total da largura. Ma la sinistra è il limite di div "a capo" che è stata del 50% muoversi in questa direzione, in modo che il centro della pagina è che è nel mezzo, si applica un margine negativo di metà della larghezza totale.

Qual das duas técnicas de centralizar o site é melhor? Quale delle due tecniche di centralizzare il sito è meglio?

Como disse, qualquer uma das técnicas CSS para centralizar um site pode ser usado; ambas produzem efeitos semelhantes. Come ho detto, nessuno dei CSS tecniche di centralizzare un sito può essere utilizzato, sia produrre effetti simili. A diferença principal é que uma atribui um posicionamento relativo à div principal ea outra um posicionamento absoluto . La differenza principale è che si dà una posizione sui principali div posizionamento assoluto e l'altro. Isso, levando-se em consideração as divs filhas, tem um grande impacto na composição do layout , como um todo. Ciò, tenendo conto dei divs figlie, ha un forte impatto sulla composizione della struttura nel suo complesso.

Mas isso é assunto para um outro artigo… ;-) Ma questo è un argomento per un altro articolo… ;-)