Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Não sei como se chama isso, por isso o nome genérico do tópico.
O que é o "@media" do CSS?
@media (min-width: 768px) {
.navbar > .container .navbar-brand,
.navbar > .container-fluid .navbar-brand {
;
}
}
Por que usar o ">" no CSS?
.container > .navbar-header,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-collapse {
margin-right: -15px;
;
}
Ou esse "and"?
@media screen and (min-width: 768px)
Hum...obrigado
Isso vai me render algumas horas de estudos...
Um backend estudando design...muitas dúvidas rs
Sobre @media leia Media Queries:
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries
Basicamente, é um bloco de código css que só será aplicado, caso a viewport do visitante satisfaça a expressão.
No caso:
@media screen and (min-width: 768px)apenas quando a tela estiver com no mínimo 768px de largura, é que as regras css dentro desse bloco serão aplicadas aos elementos.
Poderia ser algo do tipo:
@media screen and (max-width: 400px)ai só seriam aplicadas, caso o visitante esteja numa tela com no máximo 400px de largura.
Usamos isso para fazer layouts responsivos (leia sobre Responsive WebDesign.
http://sergiolopes.org/diretorio-design-responsivo/
Agora sobre o >, é um seletor css3 que diz:
-> Apenas o primeiro filho.
http://www.maujor.com/tutorial/seletores-css3.php