Skip to main content

Perguntas com a tag [css]

Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML. Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento.

Filtrar por
Ordenado por
Com tags
81 votos
4 respostas
10mil visitas

É possível fazer um tooltip com CSS puro?

É possível fazer um tooltip com CSS puro? Ou seja, sem jQuery, sem Javascript, mas somente com CSS. Por exemplo, quero fazer isso baseando no seguinte elemento: <a href="#" data-tooltip="Meu ...
Wallace Vizerra's user avatar
76 votos
18 respostas
195mil visitas

Qual a melhor forma de centralizar um elemento vertical e horizontalmente?

Qual a melhor forma (por "melhor" eu quero dizer: com maior compatibilidade possível entre browsers e o mais simples possível) de posicionar um elemento no centro da página, vertical e horizontalmente ...
Kazzkiq's user avatar
  • 12mil
65 votos
3 respostas
2mil visitas

Por que não é recomendado usar "_" (underscore) em HTML/CSS?

Já vi gente recomendando nunca usar _ (underscore) em HTML e CSS. Ao invés disso, deveríamos dar preferência para -. Exemplo: // Errado <div id="minha_div" class="minha_classe"></div> //...
user avatar
60 votos
2 respostas
4mil visitas

O que é DOM, Render Tree e Node?

Sou iniciante no JS e procuro entender a teoria, só que todos os artigos que encontro sobre DOM são demasiadamente "científicos". Não haveria uma forma mais simples de explicar isso para um "leigo"?
ropbla9's user avatar
  • 7.082
59 votos
3 respostas
48mil visitas

Qual é a diferença entre SASS e SCSS

Tenho lido sobre SASS há algum tempo e ele fornece um poderoso conjunto de funcionalidades para o CSS como variáveis, mixins e afins. E ao mesmo tempo vejo o termo SCSS. Qual a diferença entre ambos? ...
user avatar
58 votos
2 respostas
45mil visitas

Para que serve a declaração "!important"?

Para que serve a declaração !important no CSS? body { font-size: 12.5px !important; }
user avatar
53 votos
2 respostas
46mil visitas

Quando usar position absolute ou relative em CSS?

Sei que um elemento dentro com posição absolute não respeita os limites da div pai e que relative respeita, e teoricamente se posiciona em relação a si. Minhas duvidas basicamente são: Um elemento ...
ropbla9's user avatar
  • 7.082
50 votos
5 respostas
71mil visitas

Qual a diferença entre display:none e visibility:hidden?

Sei que ambos escondem o elemento, mas existe na prática alguma diferença entre: #foo{ display:none; } e #foo { visibility:hidden; }
Paulo's user avatar
  • 10,3mil
46 votos
3 respostas
5mil visitas

Como descobrir se uma cor hexadecimal é escura ou clara?

Tenho uma listagem de status que é exibida e cada status tem uma cor atribuída. Essas cores estão salvas no meu banco de dados em formato hexadecimal. Exemplo: #add555 Eu estou com um pequeno ...
Wallace Vizerra's user avatar
46 votos
5 respostas
81mil visitas

Como fixar um "menu horizontal" no topo da janela ao rolar a página?

Tenho um layout com uma barra de navegação horizontal na parte superior do site, ele está com margin-top:100px, quando rolar a página o menu deve ser fixado no topo da janela mas com margin-top:0. ...
Paulo's user avatar
  • 10,3mil
45 votos
5 respostas
111mil visitas

Como imprimir o conteúdo dentro de uma div HTML?

Tenho uma página e nela o conteúdo que quero imprimir. Criei um comando em JavaScript, porém esse comando faz imprimir a página inteira. Existe alguma forma de ser impresso apenas o conteúdo de uma ...
Felipe Viero Goulart's user avatar
41 votos
2 respostas
1mil visitas

<br> está obsoleto?

Com o advento dos layouts responsivos/adaptativo/fluidos está cada vez menos comum o uso do <br> para definir espaçamentos no layout. O uso dele não é recomendado nesses layouts modernos ou é só ...
echojn's user avatar
  • 1.141
40 votos
8 respostas
537mil visitas

Reduzir o tamanho de uma imagem e manter a proporção com CSS

Se tenho uma imagem horizontal (320x205), <div class="container"> <img src="imagem.jpg" width="320" height="205" /> </div> e coloco a regra CSS .container img { max-width: ...
brasofilo's user avatar
  • 6.735
40 votos
6 respostas
23mil visitas

Como centralizar verticalmente o conteúdo de um elemento?

Estou tentando centralizar verticalmente o conteúdo de um elemento que tem position: absolute. Consegui fazer o conteúdo se posicionar da metade para baixo do container, no entanto, da metade para ...
gustavohenke's user avatar
39 votos
3 respostas
15mil visitas

É recomendado utilizar a unidade "em" ao invés de "px" para fontes?

Vejo que alguns sites ao definir o font-size utilizam a unidade em, em uma breve pesquisa eu li que é recomendado usar em em fontes por ser melhor do que a unidade px. Afinal, qual seria a unidade ...
Paulo's user avatar
  • 10,3mil
39 votos
4 respostas
57mil visitas

Como aplicar readonly em um select?

Creio que a maioria aqui conhece a diferença entre readonly e disabled. Select Readonly O readonly não se aplica corretamente para o select <select name="field" readonly="readonly"> &...
Guilherme Lautert's user avatar
39 votos
1 resposta
6mil visitas

Qual seletor CSS tem prioridade?

Tenho o seguinte código HTML e CSS: #element p{color:blue;} .element p{color:red;} div p{color:pink;} div.element p{color:yellow;} div[name="element"] p{color:purple;} div p:...
Ricardo Mota's user avatar
  • 2.939
39 votos
1 resposta
1mil visitas

Qual a diferença entre os seletores "element element" e "element > element"?

Estava olhando o código do Twitter Bootstrap, e encontrei este CSS: .table-condensed > tfoot > tr > td { /* ... */ } Em sentido de funcionamento, qual seria a diferença de colocar apenas ...
Calebe Oliveira's user avatar
38 votos
8 respostas
66mil visitas

Input type="password" com o olho de mostrar senha

Preciso colocar um <input type="password"> com aquele olho do revelar senha, porém tem que funcionar da seguinte maneira: Usuário clica no olho e ao soltar esconde os caracteres novamente. ...
AleBabaloff's user avatar
  • 1.114
37 votos
2 respostas
86mil visitas

Como deixar imagem responsiva

Estou trabalhando em um site com característica responsiva e nele tenho uma página de promoções e gostaria que as imagens acompanhassem a mudança de tamanho do navegador, o tamanho máximo da largura ...
adventistapr's user avatar
  • 5.272
36 votos
3 respostas
17mil visitas

Como fazer uma barra de progresso que vá de 0 a 100% somente com CSS?

Estou desenvolvendo uma página onde tem uma barra de progresso e preciso fazer que ela inicie do 0 e vá ao 100%. Porém preciso fazer somente com CSS e, além disso, necessito que quando ela chegar ao ...
Maurício Krüger's user avatar
36 votos
7 respostas
40mil visitas

Qual a diferença entre padding e margin no CSS?

Pelo que percebo vejo um recuo em relação a outro elemento quando definidas as propriedades left, top, right e bottom. Existe diferença entre margin e padding no CSS? Uma resposta com exemplos(...
Marconi's user avatar
  • 18mil
35 votos
3 respostas
165mil visitas

Como centralizar horizontalmente uma div dentro de outra?

Como eu posso centralizar horizontalmente uma div que está dentro de outra div utilizando apenas CSS? No caso, podemos assumir que div externa outer tem a largura de 100%. <div id="outer"> ...
Caio Tarifa's user avatar
  • 2.341
34 votos
5 respostas
7mil visitas

Como aplicar !important do CSS via jQuery?

Estou tentando aplicar um estilo ao meu elemento e definir a importância dele, desta maneira: $('div').css('height','50px!important'); Porém, não funciona, qual seria a maneira correta?
Denis Bernardo's user avatar
30 votos
4 respostas
82mil visitas

Como estilizar um input do tipo "file"?

Tenho essa estrutura: <section id="cadastro" class="cadastroVersao pg-i"> <div class="titulo"> <h1><i class="icon-clientes"></i>Cadastro de versão</h1&...
Guilherme Laureano's user avatar
30 votos
4 respostas
3mil visitas

É necessário adicionar prefixos em algumas propriedades do CSS?

Em muitos códigos são adicionados os prefixos de compatibilidade dos navegadores em atributos do CSS. Exemplo: .exemplo { -webkit-background-size: 50% 50%; -moz-background-size: 50% 50%; -o-...
Evandro's user avatar
  • 465
29 votos
10 respostas
62mil visitas

O que devo usar no CSS, id ou class?

Comecei a praticar html e css e surgiram algumas dúvidas: Quando for criar um estilo para um elemento HTML o que devo usar no CSS, class ou id? Qual é o critério de vocês para escolher o que usar no ...
Carlos Pereira's user avatar
29 votos
10 respostas
85mil visitas

Como fazer um <div> ocupar toda a largura da página mas deixar uma lacuna de alguns pixels de cada lado em CSS?

Estou tentando fazer um cabeçalho que deveria preencher toda a largura da página, mas deixando uma lacuna de 5px em cada lado. Por exemplo: | ::::::::::::::: | | ::::::::::::::: | Nesse caso os ...
Zignd's user avatar
  • 6.941
29 votos
2 respostas
2mil visitas

O que significa o sinal de + no CSS?

Por exemplo: .input__field--minoru:focus + .input__label--minoru::after { } Estou fazendo um efeito aqui, mas não estou entendendo esse sinal de + que tem no framework. Resultado Final $(...
Diego Souza's user avatar
  • 16,7mil
29 votos
3 respostas
720 visitas

Comentários pesam?

Comentários pesam? Eu deixar comentários em todo meu código, vai influenciar em alguma coisa no site? Estou dizendo mais especificamente em HTML, CSS, JavaScript, PHP.
Lucas de Carvalho's user avatar
29 votos
2 respostas
4mil visitas

Quais as vantagens e desvantagens de minificar scripts JavaScript?

E quais minificadores posso usar?
Jose Vieira Neto's user avatar
28 votos
5 respostas
9mil visitas

Com CSS é possível colocar 2 cores em 1 letra? Ou metade do texto com uma cor diferente?

Gostaria de saber se com CSS tem como deixar apenas metade de uma letra, ou metade de uma palavra, com outra cor e a outra metade com outra? Seria possível chegar nesse resultado da imagem abaixo só ...
hugocsl's user avatar
  • 66,9mil
28 votos
9 respostas
61mil visitas

Como remover auto complete de input do google Chrome?

Quero remover background amarelo de quando esta habilitado o auto complete do Google Chrome. Tentei desabilitar o auto complete, aplicando: autocomplete="off" e não tive sucesso. A imagem de cima é a ...
Jefferson Alison's user avatar
28 votos
4 respostas
7mil visitas

Qual a prioridade do HTML? "id" ou "class"?

Gostaria de saber se o HTML trata por prioridade o id ou class. Por exemplo, se eu estou montando minha estrutura e faço o seguinte: <div class="teste1" id="teste2">TESTE</div> O que ...
Felipe Viero Goulart's user avatar
27 votos
2 respostas
21mil visitas

Alguma maneira de estilizar elemento "pai" com CSS

Olá, existe alguma maneira de selecionar o elemento pai de outro elemento com CSS? Para ser mais especifico, estou estudando em localhost usando a plataforma de fóruns phpBB3, quando uma mensagem é ...
Wagner''s user avatar
  • 1.221
26 votos
1 resposta
79mil visitas

Como estilizar a barra de rolagem?

Boas, Tenho perdido algum tempo à procura de soluções para isto mas não encontro, tenho uma scrollbar e gostava de diminuir o seu tamanho. Alguém me pode indicar algum site ou me dizer o que é ...
Bruno Gibellino's user avatar
26 votos
2 respostas
7mil visitas

Pegar cores da imagem

Há uma possibilidade (com plugins ou não) de pegar as [principais] cores ou as cores predominantes, parecido com o Adobe Kuler, da imagem? Exemplo Tenho essa imagem: E queria pegar as principais ...
Leonardo Diego's user avatar
25 votos
4 respostas
10mil visitas

Criar um triângulo com CSS

Os quadrados que apresentam a cor de um item podem ter até duas cores que neste último caso deverão ser apresentadas como se pode ver em baixo: Ambas as cores são aplicadas na propriedade de CSS ...
Zuul's user avatar
  • 35,8mil
25 votos
2 respostas
2mil visitas

Quais são as diferenças estruturais e de sintaxe entre Sass, Less e Stylus?

Hoje em dia é difícil ver pessoas escrevendo "CSS à moda antiga" por causa dos pré-processadores que facilitam a escrita removendo repetições de código, e simplificação de sintaxe. Gostaria de ...
Gabriel Rodrigues's user avatar
24 votos
7 respostas
25mil visitas

Como criar um <select> com imagens nas opções?

Achei que saberia fazer um select simples em html com imagem, porém não funciona. Começo a achar que seja problema dos browsers modernos ou do HTML5. CSS select#gender option[value="Prima"] { ...
Dorath's user avatar
  • 7.534
23 votos
6 respostas
15mil visitas

O que é e como funciona o Bootstrap?

Dei uma pesquisada, mas a maioria dos artigos que achei partem do pressuposto de que o leitor já tem alguma familiaridade com frameworks (o que não é meu caso), que ainda tenho só uma vaga ideia do ...
gustavox's user avatar
  • 4.044
23 votos
1 resposta
366 visitas

Propriedade will-change do CSS: quando utilizar?

De acordo com a especificação W3C, a propriedade will-change tem como objetivo informar ao navegador quais são as propriedades do CSS que serão modificadas para que o mesmo possa fazer otimizações ...
Woss's user avatar
  • 77,2mil
22 votos
4 respostas
21mil visitas

Como impedir um click sobre um link/âncora ou elemento com evento amarrado

No caso de um link: <a href="http://www.google.com">Google</a> ou no caso de outro elemento que tenha um evento amarrado com addEventListener, que alternativas existem para evitar que o ...
Sergio's user avatar
  • 135mil
22 votos
1 resposta
8mil visitas

O que significa o asterisco em "* {}" no CSS?

Às vezes pego sites prontos pra editar e percebo que no console aparece: * { /* código aqui */ } O que significa esse asterisco?
Lucas de Carvalho's user avatar
22 votos
6 respostas
19mil visitas

Como simular uma tela de maior resolução para verificar o comportamento de um website?

Existe alguma forma de simular uma tela com maior resolução para verificar como um site se comporta? Atualmente utilizo 1440x900 e preciso testar a interface em resoluções maiores.
Paulo's user avatar
  • 10,3mil
22 votos
3 respostas
889 visitas

Como melhorar o desempenho de arquivos estáticos de um site?

Meu site tem 10 folhas de estilos (CSS) e 15 scripts (JavaScript / jQuery), fora as imagens, isso influencia muito no carregamento. Na opinião de vocês, qual a melhor maneira de deixar o site mais ...
Alexandre Lopes's user avatar
21 votos
6 respostas
17mil visitas

Como criar formas geométricas usando CSS?

Como posso fazer as formas geométricas abaixo utilizando preferencialmente CSS? Caso não seja possível fazer utilizando somente CSS também aceito respostas com outros métodos.
Tiago P.C's user avatar
  • 1.150
21 votos
4 respostas
2mil visitas

Por que colocar JavaScript, CSS e imagens em outro servidor?

Na maioria dos sites percebi que eles usam outro servidor para carregar scripts, CSS e imagens. Porque eles utilizam?
Carlos Pereira's user avatar
21 votos
4 respostas
17mil visitas

Como tornar uma tabela responsiva usando (Twitter) Bootstrap?

Estou trabalhando numa aplicação web usando Ruby On Rails 4 e grande parte da interface consiste de tabelas. Gostaria que sugerissem uma forma de detectar o tamanho da tela em uso e, com base nisso, ...
Wilson Canda's user avatar
21 votos
6 respostas
20mil visitas

Como fazer uma ScrollBar personalizada?

Como modificar a scrollbar de uma div, para aparecer como no exemplo da imagem abaixo (Hangouts), em vez da scrollbar padrão do sistema operacional?
Calebe Oliveira's user avatar

1
2 3 4 5
171