Layout Clean - Sub-página | André Buzzo
contato@andrebuzzo.com.br | (11) 9-8551-3500 | facebook | skype:andrebuzzowebdesign

Layout Clean – Sub-página

Publicado na categoria Vídeo Aulas, Vídeo Aulas - Tableless, Vídeo Aulas - Webdesign com 9.779 visualizações e 48 comentários

Layout Clean - Criando sub-página no CSS - André Buzzo Webdesign

Fala Pessoas!!

Atendendo a pedidos nos comentários do meu site, criei essa VA sobre como estilizar, via css, a página interna de um site!

Me questionaram se a criação de um novo arquivo em css para a sub-página seria necessária, e a resposta é bem simples: NÃO! rs

De uma maneira clara e objetiva, explico como fazer a formatação das sub-páginas usando o mesmo CSS que criamos anteriormente!

Espero que ajude à todos, e desejo bons estudos!

Grande abraço, fiquem com Deus e até a próxima!

Voltar à página anterior!

  • wellington

    Ola Andre vou poupar os elogios como sempre otimo professor mas me tire uma duvida vi que vc nao estava usando o dreamweaver e era o notepad++ qual a funçao dele e outra duvida vc usa px e nao % criei um layout vou fatiar ele e por como image se eu por ele em px vai ficar parte em branco em outros navegadores .

    • Fala Wellington!

      Cara, o Notepad ++ é “apenas” um editor de texto. É uma escolha pessoal velho… Já trabalhei muito com o Dreamweaver, mas hoje, eu prefiro o Notepad para escrever meus códigos.

      Em relação à porcentagem e pixels, é isso aí. Se quiser utilizar algo que vá pegar toda a extensão do navegador, independente da resolução, se faz necessário o uso de porcentagem.

      Abraços compadre, e obrigado pelas palavras!

      Até mais!

  • Leonardo

    Olá André, sou aprendiz de webdesigner e a muito tempo vinha procurando esta vídeo aula, parabéns o conteúdo é excelente!!!

    • Fala Leonardo!

      Obrigado pelo comentário meu velho!

      Abraços!

  • Teófilo Torres

    Andre, por gentileza dá para você me enviar essa aula sendo feitas no html e bloco de notas? Sem dreamweaver. Quais os livros que você me indica, para criar sites. É muito bom o site do Daniel Lima. André, como fazer o link do menu para essas páginas? Você está inspirando e ajudando muita gente, como por exemplo o Daniel Lima… e eu, Teófilo. Obrigado André, tudo de bom para você.

    • Fala Teófilo!

      Cara…você pode usar sem problemas o Bloco de Notas (aconselho baixar um programa gratuito chamado Notepad ++), e usá-lo para seus estudos e desenvolvimento. Na seção “Banco de Scrips” se encontram todos os códigos das vídeo-aulas.

      Fico feliz em saber que de uma maneira ou outra, estou lhe ajudando!

      Forte abraço e até mais!

  • Diego

    seria bom um tutorial em video aula criar um template pra blog , e progamar pra xml voltado pra blogger.com ? tem como André ? agradeço desde já !

    • Fala Diego!

      Então mermão… eu não trabalho com o blogger cara… essa eu vou ficar realmente lhe devendo!!

      Abraços!

  • Oi andré tudo certo. Po cara estou desenvolvendo um site em wordpress e to com algumas questões no ar. Você acha mais conveniente baixar tema ou criar o seu próprio? O tema que você usa no seu site você baixa ou tem criado do zero? É que sou novo nesse negocio de wordpress.

    vlw e Abraço!!!

    • Fala Daniel!!

      Cara….eu acho que você pode usar dos dois modos. Depende daquilo que você ou seu cliente necessite.

      Eu particularmente, acho mais fácil criar um do zero do que editar um já pronto!!! Mas aí vai da paciência/prazo para entregar um projeto!

      O meu, por exemplo, foi feito “na unha” …rs

      Abraços!

  • Bruninho Volotão

    Fala ae André!
    Alguém ae em cima falou sobre template para blog. Eu uso o Blogger e to querendo fazer um template novo pra ele ao meu gosto msm, os templates do próprio blogger não gostei mto. Tem como vc fazer uma VA sobre isso?
    Abraços Filhão! :D

    • Fala Bruninho!!!

      Seguinte meu velho… eu não faço layouts para Blogger… eu já tentei mexer algumas vezes, mas achei meio complicado, e sinceramente, não tive mais tempo (graças a Deus!) por conta dos serviços, de tentar entender como funciona o desenvolvimento do layout para o mesmo…..

      Abraços!

  • Oi cara!! Ta funcionando perfeitamente agora. Eu importei os dados da tabela pro phpMyAdmin online e depois alterei os dados da conexao.

    Da uma visitada no site. http://www.danieljavass.hostoi.com/. Deixe uma opinião.

    vlw mesmo cara!!

    Abraços!!

  • Oi cara. To passando pra saber se vc pode me tirar uma duvida. Fiz um sistema de comentarios que ta funcionando legal localmente, mas quando hospedei no servidor ele deu erro. Teria como vc me passar uma dica de hospedagem de banco de dados. Eu arrastei todos os arquivos pro servidor, inclusive a tabela com extensão “.sql”. O servidor tem suporte a php.

    De uma olhada no site: http://www.danieljavass.hostoi.com/
    vlw
    Abraço!!

    • Daniel, tudo em ordem?

      Cara…vc criou as tabelas do banco de dados dentro da hospedagem, usando o “phpMyAdmin” ??

      Abraços!

  • Daniel Lima

    Oi cara! Se usar a imagem não necessita do filtro, apenas o codigo css normal:
    {background-image:url(“exemplo.gif”);
    background-repeat:repeat-x;}. Assim ele repete a imagem do eixo x. Em CSS3 precisa do filtro especifico para o explorer para criar as propriedades do degrade. Interessante não é?!!!.

    Abraço!!

    • Existe uma outra forma de se montar esse degradê!

      Você pegaria a cor de fundo do site, por exemplo, branca. Faz uma imagem em degradê, de cinza para branco. No Fireworks, vc remove a opacidade do branco, e manda repetir no eixo x. Ele vai se acinzentando no topo, e ficando branco no final, mesclando-se diretamente à cor do corpo do site…

      Abraços!

  • Se utilizar a imagem de fundo, não necessita utilizar o código de filtro.
    Utiliza o {background-image: repeat-x;} para ela repitir a imagem do eixo x.
    Se utilizar o css3, ai sim precisa do codigo de filtro especial para o explorer, pois cada navegador tem o seu código especifico.
    interessante não é? !!!

    abraço!

    • Opa…é sim!

      Mas isso é meio REGRA mesmo….rs

      Abraços!

  • Oi cara!! Dei uma pesquisada e descobri que funciona no internet explorer mas precisa de um codigo de filtro, ou então podemos fazer em imagem de fundo no css. {background-image: repeat-x;}. Um dia você poderia fazer uma video aula sobre o tema, pois é um tema interessante a ser discutido e o pessoal tem muita dúvida no assunto.

    Obrigadão pela dica!!!

    Abraço!!!

    • Opa!

      Só uma pergunta…usando o filtro ou usando a imagem?

      Abraços!

  • André.

    Parabéns por tua didática, o vídeo sobre as sub-páginas é ótimo. Eu curto muito CSS, faço alguns sites mas ainda não aprofundei da forma que desejo, agora estou partindo pro PHP. Mas confesso que seu vídeo me deu ânimo para retomar o CSS, muito obrigado!

    Sucesso na sua caminhada!!

    • Ih cara!!

      Não sei se fico contente ou triste!! hahahahahahahahahaha … qual era seu objetivo? Voltar ao CSS ou partir para o PHP ??? rs

      Abraços e obrigado pelo comentário meu velho!

      Até mais!

  • Oi cara blz!! Gostaria de saber uma coisa. Sou web designer e gosto muito de css. Gostaria de saber se é possível fazer efeito degrade em css.
    Parece bobagem, mas é uma duvida que eu tenho, porque com esse recurso eu nao precisaria utilizar imagens para fazer um degrade nos botoes do meu site.

    Abraço!!

    • Fala Daniel!!!

      Dá pra fazer isso sim!! Só temos um pequeno problema…é CSS3 e nem sempre o Internet Explorer consegue renderizar esse tipo de efeito…acho até que o 9 consegue, mas os anteriores não …

      Se quiser saber mais a respeito, procure no Google sobre “Gradient CSS3” …

      Abraços e obrigado pela visita!

      Até mais!

  • Vitório Wingert

    Cara, blz? Precisando fazer uma area administrativa, pod ajudar???
    Aguardo!

    • Fala Vitório!!

      Depende do que você precisa meu velho!!!?!?!

      Abraços!

  • Alexandre

    Third ( Tá certo ñ? –‘ ) post. Vc responde ao seu e-mail tbm ne? Eu vou encher aqui de comentários multiplos, eu penso e depois surge algo novo –‘ . Traduzindo so meio lerdinho APSOAKOSKAOSKASP’.
    O livro de
    PHP e MySQL da serie use a cabeça é de nivel principiante ne?

    • HAHAHAHAHAHAHA…

      Não sei cara…o livro do Use a Cabeça de PHP eu não conheço…mas se seguir a linha do XHTML, é sim… e um excelente livro!!

      Abraços!

  • Alexandre

    Double post denovo. –‘
    > aquele comente ta com borda –‘.
    E vc conseguiu comprar ingresso pro rock in rio.
    Vi q gosta de rock.
    Eu queria ir
    T_T’

    • Que isso…relaxa!!!

      Mas estuda sim que isso é muito bom…até acabei de “retwittar” um artigo muito bom sobre a profissão de Webdesigner… no artigo diz que precisamos mesmo, sempre nos atualizar e aprender coisas novas!!

      Quanto a ir pro Rock´n Rio, num rola!! Eu queria ir no dia do Metal, rs, minha esposa gosta de umas coisas bem mais brandas…aí ia pesar…4 ingresssos num é fácil não…rs

      E é isso mesmo…. minha cidade natal é ITU, no interior de São Paulo, mas eu moro em Salto….no interior também!!

      Abraços meu velho!

  • Alexandre

    Sorry pelo double post.
    “preencher essa lacuna lecional da minha pessoa”
    EuRi’
    Ihhh
    Pensei q vc morasse em um bairro chamado Nova Iguaçu. Um bairro em Rj – Capital.
    Eu moro Rj- Capital.
    Mais Itu em SP Ñ?
    Eu vou dar uma olhada nesse livro ;D.
    Ai eu compro esse e o outro logo.
    Obg de novo ;D

  • Alexandre

    Eu queria um de nivel mediano, ou então profissional que dê pra fazer algo ‘-‘.
    Vc não devia ter escrito a penúltima linha Hahahahaha’ ( Aguente as consequências :D) .
    Iiiih reparei q vc mora perto de mim –‘ . Vc da aula em algum curso?
    Espero sua resposta . Bom desde já agradeço

    • Fala meu velho!!

      Então…existem diversos títulos em PHP que são legais, e outros nem tanto….eu peguei um pra ler uma vez, mas era muito técnico pra mim na época….http://www.submarino.com.br/produto/1/21510667/dominando+php+e+mysql+do+iniciante+ao+profissional

      Hoje, eu acho que o entenderia bem melhor!!

      E quanto a morar perto, você mora onde? rs

      E não cara…eu dei aula uns tempos atrás na Microcamp em Itu, mas a empresa aqui começou a deslanchar (THANK´S GOD!! rs), e tive que parar de lecionar… por outro lado, quando me sobra um tempo, crio vídeo aulas pra “preencher essa lacuna lecional da minha pessoa” !!! kkkkkkkk

      Abraços!

  • Alexandre

    Mediano.
    Eu quero um que de pra fazer algo…’ –‘ Tipo algum projeto, (algo que preste) ^_^’.

  • Alexandre

    Eu te incomdando de novo o/
    Eu queria um boa referencia de livro de PHP ;D
    Desde já agrdeço .

    • Fala Alexandre!!

      Que incomodando nada meu velho!! Fica tranquilo! No que precisar, estamos por aí!!!

      Quanto a uma boa referência de livro em PHP, precisaria saber em qual nível você está na linguagem! Existem diversos livros muito bons, mas uns que são voltados à iniciantes, outros por sua vez, para programadores mais experientes…aí varia bastante!!

      Grande abraço meu velho, e só pra reforçar, fica à vontade em escrever!

      Até mais!

  • Alexandre

    Eu vo fazer uma lista pra comprar livros ( sempre compro ;D )
    Esse “Use a Cabeça: XHTML e CSS” eu vi que é um pouco velho. Valhe apena? Eu vi esse aqui:http://www.submarino.com.br/produto/1/23813994/html+5 Achei interessante.
    Eu ate tenho o “Use a Cabeça: XHTML e CSS” baixado, mais eu presto mais atenção lendo em livro do que no pc. Alguma sugestão? Os dois são bons? ;D
    Aguardo sua resposta ;D
    Desde já agradeço.

    • Fala compadre!!

      Então…o livro é “velho”, mas é de suma importância pra qualquer webdesigner!!!

      Quanto ao de HTML5, eu acho até interessante, mas pra uma linguagem que tá sendo mudada todo dia, sei não…pra ser ter uma base, é interessante…pra seguir, eu ainda acho muito cedo…. até porque não são todos os navegadores que entendem esse nhaca!!!

      Eu até tenho, se vc quiser dar uma lida, um especial sobre HTML5 postado aqui no site! O endereço é: http:www.andrebuzzo.com.br/html5

      Abraçso meu velho!
      Até mais!

  • Alexandre

    Hmmm’
    Obg. Tenho esse livro baixado. Vou dar uma lidinha ;D
    Outra coisa. Avalia esse site aqui pra mim.
    O objetivo do design. Foi deixar ele assim msm infantil e com conteúdo. Pq é pra um jogo. chamado ragnarok ;D. De sua nota *-*.
    http://img715.imageshack.us/i/terminadobgnuvem2.jpg/

    • Cara….sinceramente, eu gostei do layout! Tá infantil, mas tá muito bonito! Chama a atenção!! rs

      Abraços e parabéns!

  • Alexandre

    Bom. Eu atualmente estou no segundo ano do tec. de informática. E comecei a fazer um curso de webdesign. Eu até já sei algumas. Bastante de HTML. Mais CSS “Nem”. Eu me enrolo muito :O . É muita coisa pra estudar. Se teria algum conselho? >.<"

    • Fala meu amigo!!

      Na realidade, o conselho é o que você mesmo escreveu….tem que estudar!! …

      Existem, porém, algumas coisas que nos ajudam e muito, e uma delas, é um livro chamado “Use a Cabeça: XHTML e CSS” … cara, é leitura obrigatória para quem deseja ingressar na área!!

      Abraços!

  • João Marcos

    Fala André, uma coisa que tenho muita duvida e sobre a criação de templates para blog, se vc poder posta uma aulas sobre isso eu ficaria muito grato

    • Fala João!

      Template para blog? Qual? WordPress, Blogger, Blogspot….para qual tipo de blog vc tem dúvida?

      Abraços!

  • Thiago Cardoso

    Fala André???

    tudo beleza?

    Super 10, esse tutorial.
    acho mega interesante usar CSS e Divs pra trabalhar no HTML.

    abraços Garoto!!