Inércia Sensorial

Category: CSS

  • Estilo de listas com CSS

    As seguintes propriedades modificam estilos de listas usando Cascading Style Sheets: list-style-image: imagem como marcador; list-style-position: posição do marcador; list-style-type: tipo de marcador; list-style: abreviação para múltiplas propriedades; Como preencher os valores das propriedades: list-style-image none URL: url(diretorio/imagem.extensao) list-style-position outside: marcador desalinhado do texto inside: marcador alinhado com texto list-style-type none: sem marcador disc: círculo…

  • Declaração de CSS na página

    Eu costumo colocar todo o código de CSS em arquivos separados mas de vez em quando surge a necessidade de colocá-los no corpo da página, dentro do <head>. Para que eu nunca mais esqueça então, é assim: [html] [/html]

  • Layout de duas colunas com CSS

    Dizem que o Cálice Sagrado em Cascading Style Sheet é o layout de três colunas fluídas (ou flutuantes, ou ainda, elástico). Mas antes de mostrá-lo, e aliás, ele é relativamente fácil, começarei explicando o layout de duas colunas. Ambos compartilham o mesmo príncipio, então duas colunas com CSS bastarão por enquanto. Primeiro, comece com as…

  • Caixas CSS centralizadas

    O código abaixo centraliza uma caixa CSS na tela, colocando o tamanho das suas margens em “auto”. Não é os infames layouts de duas ou três colunas, mas apenas uma caixa mesmo bem no meio da tela, com os lados esquerdo e direito equidistantes do viewport. Ótimo para quando você tem uma caixa de tamanho…

  • Múltiplas classes CSS em um mesmo elemento

    Sim, é possível, e é muito fácil. Para aplicar mais de uma classe em um elemento, basta separar os nomes com espaços, por exemplo: [html]lorem ipsum[/html]

  • Esticar uma caixa verticalmente com CSS

    Quando você quer esticar uma caixa via CSS para ocupar todo um espaço vertical, a solução mais óbvia é fazer: [css].classe { width:100%; }[/css] E funciona na maioria das vezes. Entretanto, quando o doctype está em modo strict, a caixa não esticará para preencher todo o espaço. Isso acontece porque no modo strict, uma caixa…

  • IFrame em CSS

    Barra de rolagem em uma caixa, com CSS. Parece IFrame mas não é 🙂 Basta usar o estilo: #id{ height:50px; width: 200px; overflow:auto; Por exemplo: Ipsem Lorem, com texto aleatório. Ipsem Lorem, com texto aleatório. Ipsem Lorem, com texto aleatório. Ipsem Lorem, com texto aleatório. Ipsem Lorem, com texto aleatório. Ipsem Lorem, com texto aleatório.…