>> COLUNA: Então, na verdade, não é o melhor projetar para misturar CSS com HTML.
Em vez disso, é melhor levar o seu CSS, colocá-lo em algum lugar central, e
de alguma forma, aplicá-lo à tags em sua página web.
Para conseguir isso, nós podemos realmente parar usando o atributo de estilo e, em vez
use uma marca de estilo, que pertence ao cabeça de uma página web ao lado, para
exemplo, o seu título.
>> Vamos tentar dar um presente e re-implementar uma home page para John Harvard
usando a tag Style.
Eu já chegou nos iniciados aqui com três divs para
Homepage de John Harvard.
Mas primeiro vamos agora vá até este primeiro div e adicionar um novo atributo,
nomeadamente ID, e especificar que uma única identificador para esse div especial
deve ser, por exemplo, entre aspas "Top", um nome arbitrário, mas
descritiva na medida em que este é div de fato no topo da minha página.
>> Para a próxima div, vamos dar-lhe um ID diferente de entre aspas
"Média", e vamos dar o terceiro div um ID de entre aspas "de baixo". Nós
Agora temos três identificador único ao qual podemos aplicar algumas CSS
propriedades, mas em primeiro lugar, do retorno deixar na cabeça da página.
Logo acima do título aqui, eu vou vá em frente e definir o estilo
e feche o estilo.
>> Dentro deste momento, eu estou indo para definir algumas propriedades CSS, ou seja, a
mesmos que eu já tinha em Estilo atributos, mas aqui eles vão ser
definido de forma centralizada.
Para fazer isso, eu vou especificar a libra símbolo seguido de topo, assim
especificando que o seguinte CSS propriedades devem ser aplicadas a qualquer
Elemento HTML tem o único identificador de topo.
Estou passando então a ter algum aberto e chaves fechadas, e eu vou
especificar, por exemplo, o tamanho da fonte deve ser 36 pixels, o peso da fonte deve ser ousado.
>> Para manter as coisas limpas, eu estou colocando cada dessas propriedades agora em sua própria
linha, mas isso é apenas um convenção estilística.
Abaixo disso, vamos agora definir outra selector, por assim dizer.
Este para a tag HTML que tem identificador único de meio.
E, aqui, vamos especificar um tamanho de fonte de 24 pixels, que a seguir outra
seletor para baixo, e dentro de que, vamos especificar um
tamanho da fonte de 12 pixels.
>> Vamos agora salvar, alterar as permissões , e carregar esta página em um navegador,
chmod a + r css-1.html.
Vamos abrir Chrome e visitar http://localhost/css-1.html.
Não é mau.
Exatamente como eu pretendia, mas eu gostaria de levar as coisas um passo adiante agora e
O texto de centro John Harvard.
Agora, para fazê-lo, eu poderia envolver o página inteira em uma div como eu
fiz um exemplo anterior.
Ou eu posso ser mais inteligente e perceber que todas estas estão no interior de divs
o corpo de minha página, então por que não se aplica apenas uma ou mais propriedades CSS para o corpo
marcar a si mesmo?
>> Para isso, vamos fazer isso.
Vamos voltar para gedit aqui.
Vamos rolar para trás até a tag estilo, e vamos especificar apenas um seletor
usando essa tag nome, Corpo.
Abaixo disso, vamos colocar nossas chaves seguido pelo centro text-align.
Vamos agora salvar a página e recarregar lo dentro desse browser.
Atualizar no Chrome, e voila.
Agora temos página de John Harvard centrado como pretendíamos.