02 junho 2012

Estilos CSS 1 + Novo Layout

Olá gente, agora vou ensinar pra vocês um pouco do css, pra quem não sabe CSS é a abreviatura para Cascading Style Sheets, Folha de Estilos em Cascata. é muito usado para colocar backgrounds, links e estilos pelo Html, Mais nem sempre é o css. Então hoje vou ensinar alguns comandos para o css e vai ter também um tutorial sobre isso. Vamos lá..

 Mais antes de começar o tutorial,vou falar sobre o meu novo layout (designer,modelo) novo, não é demais, esse por enquanto foi o que eu fiz que eu mais gostei. então vamos lá gente! clique em leia mais vamos lá...

Alguns CSS que usamos



background: ;
color: ;
font-size: ;
font-family: ;


a:hover{ 
border: ;
top: ;


então esses acima são mais usados, pra quem não sabe o que eles significam (quer dizer) leia a explicação abaixo:


background: ;


O próprio nome diz, é o background de fundo. nele você pode colocar a cor assim:
background: #cccccc ;


e pode colocar também uma imagem de fundo assim:
background: url(http://fundo002.com.br);


mais se você colocar com imagem você deve saber que as imagens podem repetir ou não, então depois que acaba o código do url da imagem, coloque no-repeat para não repetir, ou repeat para repetir, assim:

background: url(http://fundo002.com.br) no-repeat;
background: url(http://fundo002.com.br) repeat;

Resumo:
REPEAT: Para repetir
NO-REPEAT: Para não repetir
BACKGROUND: Background color, background imagem


color: ;

esse é o mais simples e o mais usado hoje em dia para definir a cor da letra. assim:
color: #000000; para definir a cor da letra.

se você quiser colocar uma cor na letra, faça o seguinte entre de " : e ; ", coloque o código da cor.
#ff50ff : Rosa       #ffffff : Branco     #000000 : Preto..
ficando assim: 
color: #000000;

Resumo:
COLOR: utilizado para definir a cor da letra.


Font-size: ;

usado para definir o tamanho da fonte (letra),para definir o tamanho da fonte coloque o tamanho da font (ex: 12, 15, 18...) e depois ponha o px.
assim:
font-size: 15px;
e assim define o tamanho da fonte.

Resumo:
FONT-SIZE: tamanho da fonte.
PX: o mais usado para o tamanho.


Bem gente é só isso.
Vou colocar o resto no próximo post.
valeu gente, comentem bastante.








25 comentários:

  1. Dando aulas de html
    que legal!

    http://semcontrole.net.tc

    ResponderExcluir
  2. Oi linda,tudo bom? estou aqui para dizer que adorei o blog e as postagens,estou te convidando para participar de um concurso lá no blog,você vai amar os prêmios! beijo,participe:
    http://clubedetres.blogspot.com.br/

    ResponderExcluir
  3. fantástico!

    http://estilohedonico.blogspot.pt/

    xoxo

    ResponderExcluir
  4. Css pra mim é bicho de 7 cabeças kkkk

    Adorei o lay novo, eu tb mudei o meu recentemente.

    http://www.umamulherdefases.com.br/

    ResponderExcluir
  5. Super legal deby essa postagem. e seu blog ficou muito lindo e fofinho. adorei...

    beijinhos...
    Sucessos e mais sucessos....

    Dan..

    ResponderExcluir
  6. css pra mim nossa não sei nada... fico toda hora fazendo isso mais não consigo mudar nada no meu blog. a unica coisa que eu sei é a cor da letra.. só issoo.... kk

    seu blog ficou muito lindo e super kawaii adorei demais...
    beijoss...

    http://receitadakaka.blogspot.com/

    ResponderExcluir
  7. muito show esse post adorei..
    o blog ficou lindo...

    ResponderExcluir
  8. oi oi deeby
    obg pela visita la no blog,bejus
    http://so-pra-teens.blogspot.com.br/

    ResponderExcluir
  9. Noossa seu lay ficou lindoo!*-*
    Achava que era bem mais dificil mexer no css,mais agora com essas diquinhas ficou facil!Bora tentar,no meu blog!kkk
    bj morangocom.blogspot.com

    ResponderExcluir
  10. oi ja estou seguindo e adorei aqui...

    poderia me ajudar e me seguir tb...


    www.makepopular.blogspot.com.br

    e participe do sorteio de um mega kit de esmaltes risque...

    ResponderExcluir
  11. Oi debora adorei o lay que fizeste pra mim,ficou muito fofo,desculpe por não ter te respondido antes eu estava ausente do blog esses dias,então como faço pra colocar o lay sem perder meus gadgetes e anuncios do meu blog bjos

    ResponderExcluir
  12. oi,
    otimo post
    adorei seu blog, muito lindo!
    estou te seguindo, segue o meu tambem
    http://lostgirlygirl.blogspot.com.br/

    bjos

    ResponderExcluir
  13. boa dica, num entendo muito dessas coisas de css.

    ResponderExcluir
  14. Gostei das dicas que tens no teu blog! :)
    Mas css não é para mim! hehe! :)

    mychoise1.blogspot.com

    ResponderExcluir
  15. oiee..
    gostei de seu blog..
    suas dicas são muito interessantes..bacana mesmo..
    te seguindo, dp me siga de volta.bjus
    http://www.helenageral.blogspot.com.br/

    ResponderExcluir
  16. Oii que bacana adorei a aula.

    bjs
    http://cosmeticosbelezasaude.blogspot.com.br

    ResponderExcluir
  17. Esses Css é simples mas é bem utilizados na hora de reformar seu layout.. *-*

    www.ecleticus.com

    ResponderExcluir
  18. para quem tá começando então!!! Dica de ouro!
    http://cafecomdoideira.blogspot.com

    ResponderExcluir
  19. Adorei seu layout novo! Ficou muito fofo!

    Beijos.

    Kika/Acessarte.

    www.blogacessarte.blogspot.com
    www.acessarte.com (loja virtual)

    ResponderExcluir
  20. oi debora pode colocar no meu blog como comentario ok!!
    estou te seguindo me segue de volta bjo

    ResponderExcluir
  21. O layout ficou lindo *o*
    De HTML até queentendo um pouco consigo me virar, agora CSS, me confundo mais do que tudo D:
    Beijo.

    http://vitaminadepimenta.blogspot.com.br/
    @LariCrazy_

    ResponderExcluir
  22. Que massa flor! o lay ta lindo curti...



    BEIJUXX
    http://ianapaulinhaaaa.blogspot.com.br/

    ResponderExcluir
  23. Eu acho show rs o CSS, logo pretendo aprender mais sobre ele no meu curso, o lay ficou divo, amei, e to seguindo aqui


    http://www.perfeitinhablog.com/
    http://thaisr-encomendas.blogspot.com.br/

    ResponderExcluir

Créditos Blog Conectada| www.blogconnectada.blogspot.com - 2014 // Todos os direitos reservados // Para encomendar entre em contato.