Postagens

Mostrando postagens de setembro, 2020

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...