Partes de codigo 2025, Janeiro

Fita de canto - CSS-Tricks

Fita de canto - CSS-Tricks

NEWS .wrapper (margem: 50px automático; largura: 280px; altura: 370px; fundo: branco; raio da borda: 10px; -webkit-box-shadow: 0px 0px 8px rgba (0,0,0,0.3); "

Altura mínima entre navegadores - CSS-Tricks

Altura mínima entre navegadores - CSS-Tricks

Div (min-height: 500px; height: auto! important; height: 500px;) Isso funciona porque (felizmente?) o IE trata "height" como "min-height" deve ser "

Cross Browser Inline-Block - CSS-Tricks

Cross Browser Inline-Block - CSS-Tricks

Li (largura: 200px; altura mínima: 250px; borda: 1px sólido # 000; display: -moz-inline-stack; display: inline-block; vertical-align: top; margin: 5px; zoom: "

Comprimir CSS com PHP - CSS-Tricks

Comprimir CSS com PHP - CSS-Tricks

Inicie seus arquivos CSS com este PHP (e nomeie-o como style.php): body (color: red;) Em seguida, chame seu CSS com o nome do arquivo PHP: "

Ícones Unicode Comuns - CSS-Tricks

Ícones Unicode Comuns - CSS-Tricks

A: before (content: "2709";) .phone: before (content: "2706";) .important: before (content: "27BD";) blockquote: before (content: "275D";) "

Comentários em CSS - CSS-Tricks

Comentários em CSS - CSS-Tricks

Exemplo: body (font-size: 62,5% / * 1em = 10px * /) O material dentro das marcas / * * / são comentários CSS. Isso permite que você insira notas no CSS que "

O Clearfix: Força um elemento a limpar seus filhos - CSS-Tricks

O Clearfix: Força um elemento a limpar seus filhos - CSS-Tricks

Isso vai servir para você hoje em dia (IE 8 e superior): .group: after (content: ""; display: table; clear: both;) Aplique-o a qualquer elemento pai no qual você "

Alterar estilos de preenchimento automático em navegadores WebKit - CSS-Tricks

Alterar estilos de preenchimento automático em navegadores WebKit - CSS-Tricks

Recebemos uma boa dica de Lydia Dugger por e-mail com um método para alterar os estilos que os navegadores WebKit aplicam aos campos de formulário que foram "

Centrando um site - CSS-Tricks

Centrando um site - CSS-Tricks

# quebra de página (largura: 800px; margem: 0 auto;) "

Alterar cor de seleção de texto - CSS-Tricks

Alterar cor de seleção de texto - CSS-Tricks

:: seleção (cor de fundo: #FFA; cor: # 000;) (Mais informações) "

Botões de pagamento da Apple em CSS - CSS-Tricks

Botões de pagamento da Apple em CSS - CSS-Tricks

Você não precisa criar seus próprios botões para o Apple Pay. Na verdade, a Apple literalmente diz que você não pode. Então, o que você deve fazer na web? Agradecidamente,"

Hacks específicos do navegador - CSS-Tricks

Hacks específicos do navegador - CSS-Tricks

***** Selector Hacks ****** / / * IE6 e abaixo * / * html #uno (color: red) / * IE7 * / *: first-child + html #dos (color: red) / * IE7, FF, Saf, Opera * / "

Center DIV com altura dinâmica - CSS-Tricks

Center DIV com altura dinâmica - CSS-Tricks

CSS: * (margin: 0; padding: 0;) #page (display: table; overflow: hidden; margin: 0px auto;) *: first-child + html #page (position: relative;) / * ie7 * / * html "

Textura granulada animada - CSS-Tricks

Textura granulada animada - CSS-Tricks

O site DayTrip usa um efeito elegante no cabeçalho da página que distorce a imagem de fundo com uma textura granulada animada. O efeito é sutil, mas "

Bouncy Animated Carregando Animação - CSS-Tricks

Bouncy Animated Carregando Animação - CSS-Tricks

Apenas alguns funzies com animações CSS3. Se você está preocupado com o suporte a navegadores superdimensionados, use um GIF. .loader (text-align: center;) .loader span ("

Texto Desfocado - CSS-Tricks

Texto Desfocado - CSS-Tricks

Torne a cor do texto transparente, mas adicione uma sombra: .blur (cor: transparente; sombra do texto: 0 0 5px rgba (0,0,0,0.5);) Desfocado Mais navegadores suportam cores "

Noções básicas da API de fontes do Google - CSS-Tricks

Noções básicas da API de fontes do Google - CSS-Tricks

Link para arquivos CSS Basicamente, você faz um hotlink direto para arquivos CSS no Google.com. Por meio dos parâmetros de URL, você especifica quais fontes deseja e quais "

Centro absoluto (vertical e horizontal) uma imagem - CSS-Tricks

Centro absoluto (vertical e horizontal) uma imagem - CSS-Tricks

Técnica de imagem de fundo CSS: html (largura: 100%; altura: 100%; fundo: url (7518965 / absolute_center_vertical_horizontal_an_image_css-tricks.png.webp) center center no-repeat;) CSS + Técnica de imagem embutida: img ("

Better Helvetica - CSS-Tricks

Better Helvetica - CSS-Tricks

Corpo (família da fonte: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; peso da fonte: 300;) "

Rollover de link básico como CSS Sprite - CSS-Tricks

Rollover de link básico como CSS Sprite - CSS-Tricks

A (background: url (sprite.png.webp) sem repetição; display: block; height: 30px; width: 250px;) a: hover (background-position: 0 -30px;) A altura definida e "

Acessibilidade / SEO Amigável CSS Hiding - CSS-Tricks

Acessibilidade / SEO Amigável CSS Hiding - CSS-Tricks

.screen-reader-text (position: absolute; top: -9999px; left: -9999px;) Esta classe pode remover um item da página, tirando-o do fluxo e não "

Todos os tipos de mídia de folha de estilo - CSS-Tricks

Todos os tipos de mídia de folha de estilo - CSS-Tricks

All Usado para todos os dispositivos de tipo de mídia aural Usado para sintetizadores de voz e som braille Usado para dispositivos de feedback tátil braille em relevo Usado para paginado "

Apple.com Menu de pão de hambúrguer - CSS-Tricks

Apple.com Menu de pão de hambúrguer - CSS-Tricks

A Apple fez algum barulho quando lançou um site atualizado, incluindo uma navegação responsiva totalmente nova. Enquanto o redesenho estava focado em outras coisas, um "