Postagens

CSS: display

Imagem
  CSS: display (Elivelto Ebermam)   A propriedade display controla como os elementos serão posicionados na tela. Existem quatro valores básicos que podem ser usados para essa propriedade: none, block, inline e inline-block. O valor none é usado para o elemento não aparecer na tela. O valor block faz com que o elemento use a linha toda da tela, mesmo que não ocupe todo o espaço, ou seja, não permite que se adicione outro elemento ao lado dele. O valor inline só ocupa o espaço referente ao seu conteúdo, permitindo que se adicione outros elementos ao seu lado. Porém ele não permite definir a largura e altura do elemento por exemplo. O valor inline-block é a combinação dos dois anteriores, ele permite que se adicione elementos ao lado e que se defina largura e altura por exemplo.   Características Valores para a propriedade display block inline Inline-block Ocupa toda a linha da tela? sim ...

CSS: margin, padding e border

Imagem
  CSS: margin, padding e border (Elivelto Ebermam)   Na confecção do layout de um site, três elementos são muito importantes: margens, espaçamentos e bordas. As margens (propriedade margin) é espaçamento do elemento em relação ao exterior. A propriedade padding define o espaçamento interno em relação ao conteúdo do elemento. Já a propriedade border define as bordas do elemento. Veja: Note que os espaçamentos ocorrem em quatro direções, e em CSS tem as seguintes nomenclaturas: top (parte superior), bottom (parte inferior), left (lado esquerdo) e right (lado direito). Propriedade margin A propriedade margin é responsável por definir as margens do elemento. Há quatro margens: margin-top, margin-bottom, margin-left e margin-right. Veja na imagem abaixo: Há duas formas de inserir margens usando o CSS: usar a propriedade margin diretamente ou usar suas propriedades derivadas. Para começar, vamos ver um código de ...

CSS: div

Imagem
  CSS: div (Elivelto Ebermam)   Uma div é basicamente uma caixa ou um contêiner em HTML. A tag usada para inserir uma é a <div>. Ela é usada para acomodar outros elementos. Ela é um elemento muito importante na elaboração do layout do site.   Definindo as dimensões da div (propriedades width e height) Com o CSS podemos definir o tamanho das divs. Para isso usamos as propriedades width para definir a largura e height para definir a altura. Para o primeiro exemplo vamos adicionar também a propriedade background-color para darmos uma cor para div, facilitando assim a visualização das dimensões da div:   Disponível em: https://www.w3schools.com/code/tryit.asp?filename=GIU3SC5WBDKE   Nesse exemplo definimos uma regra para as divs em geral, ou seja, todas as divs terão essas propriedades. Se quisermos regras diferentes para as divs, temos que usar classes ou ids.     div { w...