Estilizando nossa página com CSS 3 – Parte 1

Fala pessoal, tudo certo?

No último post terminamos de realizar a marcação da nossa página e como venho comentando nos posts o HTML5 passou a dar preferência apenas para a marcação do site, deixando a parte de estilização para o CSS.

“Mas o que é CSS?”

Para quem ainda não conhece o CSS ou Cascade Style Sheet (traduzindo para o português fica Folha de Estilo em Cascata), é um mecanismo para adicionar estilo (cores, fontes, espaçamento, etc.) a um documento web.

Agora que sabemos o que é, vamos falar um pouco de como incluir CSS em nossa página.

Existem basicamente três formas de fazer isso: inline, em bloco ou em arquivo.

Vamos começar pelo CSS inline:

Neste exemplo criamos um parágrafo com o texto “Olá Mundo”, com fundo preto (background-color: black) e texto branco (color: white), desta forma:

Agora vamos fazer o mesmo exemplo, utilizando o css em bloco:

Na linha 1 temos o nosso parágrafo somente com o texto. Da linha 2 até a linha 7 temos o bloco de CSS, definido através da tag <style>. Entre as tags, temos o p, que nada mais é do que um seletor, que determina que todos os parágrafos da nossa página (tag <p>) devem ter o estilo definido dentro das chaves.

Por último temos a utilização através de um arquivo de folha de estilo, chamado de estilo.css.

Na página HTML temos a seguinte marcação:

E no arquivo estilo.css, basta incluir o que estava entre as tags <style> da nossa página HTML.

Consegui uma parceria com a DankiCode e consegui vários curso com preços especiais. Um deles é o curso WebMaster Front-End Completo, que é um dos melhores cursos pra você que deseja se especializar em desenvolvimento de páginas web.

Além de ser um curso bastante completo, você também leva 30 dias de garantia, onde você pode solicitar o seu dinheiro de volta à qualquer momento, que será prontamente devolvido sem nenhum questionamento por parte da empresa.

Clique aqui e garanta já sua inscrição no curso, com acesso vitalício de qualquer dispositivo.

Espero que tenha gostado deste pequeno artigo.

Nos vemos em breve!

Forte abraço e bons estudos.

Novas tags do HTML5 – Parte 1

Olá pessoal, tudo certo com vocês?

Como prometido no último artigo, começaremos agora o desenvolvimento de uma página simples, utilizando algumas das novas tags introduzidas no HTML5 para que possamos nos familiarizar com a linguagem.

Para iniciar um site, eu costumo fazer um pequeno esboço de como serão divididas as sessões da página. Para isso eu utilizo qualquer editor de imagens. Se você tiver utilizando qualquer versão do Windows, você pode fazer utilizando o Paint. Caso esteja usando alguma distribuição Linux, indico utilizar o Gimp. Este editor é muito mais poderoso que o Paint e além de ser um software livre, você também pode utilizá-lo no Windows.

A seguir seguem dois exemplos de esboço:

Como podemos observar, os exemplos acima são apenas esboços mesmo, como forma de facilitar a codificação eu já inclui as tags que vou utilizar em cada parte da página.

A partir do próximo artigo iremos começar codificar os dois modelos, porém incluindo algumas imagens e textos para melhorar a experiência no desenvolvimento da página.

Caso queira um curso completo para se tornar um desenvolvedor Full Stack, com mais de 80 projetos práticos e mais de 1000 aulas gravadas e constantemente atualizadas, que inclusive tem um módulo específico que trata sobre o HTML5, basta clicar aqui e adquiri-lo por um excelente preço promocional, que estará disponível por pouco tempo. 

Abraços e até a próxima.

Por onde começar

Uma pergunta recorrente feita por quem deseja aprender a desenvolver sistemas é:

“Por onde eu devo começar?”

Essa pergunta é feita por todos que tem o desejo de aprender a desenvolver software, principalmente quem nunca fez um curso na área ou que deseja aprender a programar sozinho.

Eu já vi alguns casos de pessoas que aprenderam sozinhos a programar, pesquisando na internet e fazendo acontecer.

Inicialmente, para você aprender a desenvolver software, costumo dizer que você precisa ser uma pessoa bastante curiosa, visto que com o tempo e a experiência, sua caminhada vai se tornando mais suave e você irá perceber que a curiosidade será sua aliada e após dominar a primeira linguagem de programação você verá que aprender qualquer outra tecnologia será bem mais fácil, pois seu cérebro estará pronto e programado para entender a tão famosa lógica de programação.

Existe um e-book que eu li e recomendo muito, escrito pelo desenvolvedor Guilherme Cherem Grillo, lista passo-a-passo o que você precisa fazer para se tornar um desenvolvedor.

Clique aqui para baixar o e-book.

Esse e-book é um guia completo para quem deseja se tornar um desenvolvedor de software Full-Stack.

Aí você me pergunta:

O que é ser um desenvolvedor Full-Stack?

Este termo é muito conhecido pela comunidade e significa que ao se tornar um desenvolvedor Full-Stack indica que você domina tanto as tecnologias de Front-End (Interface com o usuário – lado do cliente), quanto as tecnologias de Back-End (linguagem de programação – do lado do servidor).

Um forte abraço e nos vemos em breve.