Aula 02 sintaxe css

Sintaxe – CSS
Style Sheet
Professor: Jolvani
Aula 02

Sintaxe CSS
 Olá, quando vcs estiverem terminado as aulas
de css, suas páginas estarão bem mais
“estilosas”...
 Ai deixarão de ser simples codificadores html
e se tornarão verdadeiros programadores de
interface.
 Lembre-se que o html é utilizado para
estruturar suas páginas e o Css é que faz toda
aquela apresentação visual...
 Nesta aula iremos construir a primeira pagina
usando CSS, e iremos aprender a sintaxe do
CSS...

Sintaxe CSS
 Organize seu diretório ou pasta de trabalho e copie a ultima pagina de xhtml
para seu novo diretório css... Renomeio o arquivo para aula02.html
 Já usamos o atributo style e usamos valores para ele, exemplo cores no
texto, lembram cores por nome, rgb ou hexa...
 Então, esse atributo style, recebe exatamente declarações CSS, essas
declarações são compostas de propriedades e seus valores, se tivermos varias
propriedades e valores, separamos por ponto e vírgula (;).
 Vamos aprofundar um pouco mais...

Sintaxe CSS
 Existe uma tag chamada style que deve ser
declarada entre o cabeçalho <head> html e
serve para definir os estilos da pagina...
 Também é possível e aconselhável criar um
arquivo separado css para a pagina, que
veremos + adiante.
 Então vejamos como fica...
 No html4 era necessário especificar o
atributo type identificando o tipo do
documento que estamos trabalhando....
Type=“text/css” no html5 não é mais
necessário...
 Se colocarmos somente a
declaração não será aplicada a
nenhum elemento.
 Precisamos informa em qual
elemento aplicar...
 Para fazer isso vc precisa usar
seletores... Seletores indicam
aonde eu quero aplicar o
elemento, qual o meu alvo....

Sintaxe CSS
 Então, qual é o meu alvo? É o elemento <p> então
vejamos....
 A declaração fica sempre entre chaves { }
 Então o elemento p é chamado de seletor e ele
indica com precisão onde eu quero na minha
marcação html aplicar a regra css (o resultado, o
efeito).
 No site w3school vc encontra a sintaxe fundamental,
a regra básica da sintaxe css.
 Ela é composta de duas partes, o seletor que são os
elementos do html (ou aqueles que eu criar) e a
declaração que fica entre chaves. Nos podemos ter
várias declarações.
 Cada declaração é composta por uma propriedade e
seu valor, sendo separadas por ponto e vírgula (;)

Sintaxe CSS
 Veja a maneira de usar as declarações...
 Agora vamos incrementar + nosso Css...
 Vendo o código e o resultado, como eu posso
alterar a cor do cabeçalho <h1>?
 É so criar um seletor para ele h1 { color:#006699}

Sintaxe CSS
 No css nos temos a possibilidade de
colocar a mesma regra par vários
seletores.... Separando-os com uma
virgula (,)
 E se quiséssemos somente trocar a fonte
do nosso cabeçalho (h1) então
poderíamos criar um novo seletor
somente com o nome da fonte...
 Agora imagine se eu defino o valor com
mais do que uma palavra, então use
aspas duplas...
 Último aspecto comentários....

Sintaxe CSS
 Para usar comentários em css use os
carateres /* para abrir e */ para fechar
 Até a próxima...

Próxima Aula: Utilização in-line, incorporado e externo

Aula 02 sintaxe css

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (18)

Andere mochten auch

Andere mochten auch (20)

Ähnlich wie Aula 02 sintaxe css

Ähnlich wie Aula 02 sintaxe css (20)

Mehr von Jolvani Morgan

Mehr von Jolvani Morgan (10)

Aula 02 sintaxe css