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.
818
perguntas
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 ...
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:...
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"?
20
votos
3
respostas
3mil
visitas
Por que é considerado errado/ruim repetir uma ID em HTML?
Acho que o título diz tudo, por que é considerado errado repetirmos IDs em HTML?
Noto muita gente fazendo coisas como:
<div id="foo">bar</div>
<div id="foo">baz</div>
Para ...
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 ...
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;
}
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 ...
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 ...
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 ...
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-...
7
votos
3
respostas
3mil
visitas
Como deixar DIVs auto-ajustáveis verticalmente?
Estou com problemas ao tentar deixar algumas divs auto-ajustáveis verticalmente.
Há o espaço necessário para a div ficar exatamente abaixo da que está acima dela, mas ela não sobe, fica um espaço ...
81
votos
4
respostas
11mil
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 ...
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 ...
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&...
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 ...
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 ...
13
votos
4
respostas
6mil
visitas
Volta ao Inicio da página
Preciso ter um ícone fixo na página no canto direito em baixo da tela. Ao clicar nesse ícone
ele volta para o inicio da página, fazendo o Scroll rolar até o topo da página.
Alguém poderia me ajudar? ...
4
votos
3
respostas
70mil
visitas
Caminho para acesso de pastas html ,css,php etc [duplicada]
Alguém poderia me explicar esse sistema de nives para acessar pasta no uso de linguagens como html,css e php (../)(.../)(./).?
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
$(...
17
votos
3
respostas
7mil
visitas
Como fazer um marquee sem a tag <marquee>?
Estou precisando usar um marquee, mas como todos estão falando que marquee é uma coisa pré-histórica e não deve ser usado mais, estou em dúvida quanto ao que usar no lugar dele. No site da MDN fala ...
12
votos
2
respostas
14mil
visitas
O que é User Agent StyleSheets?
Estudando sobre CSS me deparei com o termo User Agent, ou folhas de estilo padrão usados pelos navegadores em caso de ausência de folhas de estilos.
O que é o User Agent?
Cada navegador tem um User ...
7
votos
3
respostas
19mil
visitas
Fixar primeira linha tabela
Preciso fixar a primeira linha da minha tabela sempre no topo da página.
Já li várias perguntas sobre esse mesmo problema, mas não consegui resolver...
O meu código:
<table border="2px">
<...
2
votos
3
respostas
1mil
visitas
Imprimir página com Background
Estou trabalhando com a criação e impressão de relatórios com PHP, onde é gerada uma página web com o conteúdo do relatório.
Gostaria de colocar a marca d'água "CANCELADO", quando um relatório for ...
1
voto
1
resposta
1mil
visitas
Como declarar e usar a regra @viewport?
Estive lendo que a meta viewport possui melhor implementação pela rule viewport CSS, todavia, ainda está confuso para mim...
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;
}
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.
...
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 ...
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">
...
29
votos
2
respostas
4mil
visitas
Quais as vantagens e desvantagens de minificar scripts JavaScript?
E quais minificadores posso usar?
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 é ...
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.
14
votos
5
respostas
19mil
visitas
Alterar o background do input preenchido pelo autocomplete do Chrome
Estou a criar um formulário, e como é de conhecimento de todos que, o navegador tem a opção "preenchimento automático", até ai tudo bem, mas me deparei com a seguinte situação:
Como podem notar na ...
8
votos
4
respostas
3mil
visitas
Problema com altura de divs que não acompanham o conteudo uma da outra
Estou com um problema que creio eu ser fácil, mas não consigo entender como resolver.
Tenho uma estrutura do tipo:
<div class="conteudo">
<div class="esquerda">
</div>
...
19
votos
2
respostas
1mil
visitas
Para que serve e quando usar versão em arquivos .js e .css?
Para que serve e quando usar
arquivo.js?v=123(exemplo)
arquivo.css?v=123(exemplo)
Quais benefícios e como o navegador interpreta isso
18
votos
1
resposta
5mil
visitas
Como funcionam os seletores >, + , ~ no CSS?
Seletor +
Pega o primeiro elemento encontrado após sua declaração.
div + p {
font-size: 20px;
}
<div>
</div>
<p>Este é um paragrafo</p>
<p>Este é outro paragrafo&...
17
votos
4
respostas
8mil
visitas
Como funciona sistema de grid?
Estou utilizando Bootstrap num projeto, mas até agora não entendi como funciona a estrutura do mesmo. Ele utiliza grids mas a documentação não é bem clara sobre como funciona e como utilizar.
Quero ...
14
votos
2
respostas
6mil
visitas
Como forçar carregamento de arquivos JS e CSS a cada nova versão publicada?
Toda a vez que publico uma nova versão da minha aplicação web (um sistema multiempresas) que possua alterações em arquivos JS e CSS, alguns clientes reclamam de erros e acabo constatando que é a cache ...
13
votos
1
resposta
4mil
visitas
O que significa o "--" especificado no :root do CSS do Bootstrap?
É só uma dúvida que surgiu quando bisbilhotava o CSS do Bootstrap, isso é algo que desconheço e não achei resposta no google sobre isso...
Vai um trecho do código:
:root {
--blue: #007bff;
...
5
votos
3
respostas
480
visitas
Como posso fazer que em determinada classe apareça "..." após atingir um limite de carcteres
Queria que quando chegasse em um limite estimado de carcteres aparecesse ... para não poluir a tela.
5
votos
4
respostas
8mil
visitas
Como suavizar a fonte com CSS no Chrome?
Estou com um problema de fonte "craquelado" no Chrome, ou seja, parece que as pontas ficam pixelizadas.
Para ajudar, estou postando duas imagens
IE:
Chrome:
O meu CSS que chama a fonte:
@font-...
4
votos
1
resposta
223
visitas
Padding de baixo maior do que o definido no CSS
Tenho uma situação em que defino o padding de uma div dentro do header com:
#header_inn{
padding: 5px 2%;
width: 96%;
}
Eu quero que os paddings top e bottom tenham exatos 5px, porém o de ...
3
votos
2
respostas
1mil
visitas
Como fazer quebra de linha de uma string em PHP dentro de um div
Possuo uma <div> que cria uma caixa aonde eu deveria imprimir uma string em PHP vinda de um banco de dados, porém quando a string é muito grande, ao invés de realizar a quebra de linha a string ...
2
votos
5
respostas
3mil
visitas
Footer sempre no final da pagina
Quero saber como faço para deixar o footer sempre na parte de baixo da tela, mesmo em telas pequenas.
Estou usando bootstrap.
Esta deste jeito:
Quero deixar o footer sempre no final da pagina ...
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 ...
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 é ...
12
votos
4
respostas
17mil
visitas
Estilizar um input type='number' para trocar as setas
Como personalizar o input type='number' como a imagem a seguir?
Clicando no +/- soma ou subtrai o número dentro do box.
Atualmente meu código é:
.bedrooms
= f.input :bedrooms, :label => ...
8
votos
4
respostas
52mil
visitas
Fixar o rodapé de uma página html e acompanhar o conteúdo da página
Eu preciso fixar a tag footer no final da página html, mas quando o conteúdo exceder a página a tag footer deve acompanhar o conteúdo e não ficar fixa.
Veja o código CSS é o código HTML que estou ...
6
votos
2
respostas
800
visitas
Fazer uma lista quadriculada HTML
Olá, gostaria de saber se é possível fazer uma lista quadriculada, como a da imagem abaixo, apenas com css (favor desconsiderar linhas azuis):
eu achei a função nth-child do css, mas consegui apenas ...
5
votos
1
resposta
279
visitas
O que é exatamente o seletor elemento.classe?
Eu estava desenvolvendo e uma coisa me chamou bastante a atenção: a regra elemento .classe é diferente de elemento.classe.
Percebi que a principal diferença é que a primeira poderia ser lida assim: "...
3
votos
2
respostas
15mil
visitas
Personalizar option do select
Pessoal estou tentando personalizar os options do select porém as cores do hover não mudam sempre ficam azul. Segue o código
.personalizar-select{
border: 1px solid red;
}
.personalizar-...