Programação para todos

CSS: float (Elivelto Ebermam)   A propriedade float define como os elementos irão flutuar na tela. Basicamente são utilizados dois valores: left e right. Quando o valor é left, o elemento irá flutuar a esquerda, e quando o valor é right, flutuará a direita. Existem outros dois valores: none e inherit. O valor none é o valor padrão, e diz que o elemento não flutuará. Já no valor inherit, o elemento usará o mesmo valor do que seu elemento ancestral (em que ele está contido).   float left Quando o valor de float é left, o elemento flutuará a esquerda. Veja um exemplo: Disponível em: https://www.w3schools.com/code/tryit.asp?filename=GKBHDQ7982GO   No exemplo há uma div vermelha e um parágrafo. Note que, com a propriedade float tendo o valor left, a div ocupa o espaço a esquerda e o parágrafo é distribuído ao redor dela.   float right Quando o valor de float é right, o elemento flutuará a direita....

CSS: position (Elivelto Ebermam)   A propriedade position define o método de posicionamento dos elementos na tela. A propriedade position trabalha em conjunto com outras quatro propriedades: top, left, right e bottom. Essas propriedades são responsáveis por deslocar os elementos. Para a propriedade position há cinco valores possíveis: static, relative, absolute, fixed e sticky. Cada um desses valores tem características próprias.   Static O valor static é o valor padrão de position, ou seja, se você não informar qual é a position do elemento, o navegador entenderá que é static. Quando o valor é static, não é possível atribuir ao elemento as propriedades top, left, right e bottom. Assim, o elemento sempre ficará no canto (a não ser que se use margens). Veja um exemplo:   Disponível em: https://www.w3schools.com/code/tryit.asp?filename=GKAL0H05HL3K   No exemplo há três divs, todas com posicioname...

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