Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola Pessoal,
Estou organizando o css e queria que a classe que fica no index (exemplo: se-include) utilizando uma classe do Bootstrap, mas de acordo com a resolução...
Assim, ele colocaria a class de acordo com a resolução seria o tamanho do Bootstrap....
Não esta funcionando, então poderiam me ajudar?
/ Smarthphones no formato "retrato" /
@media screen and (min-width: 480px) and (orientation:landscape){
html{
font-size: 14px;
}
.btn{ font-size: 12px; }
.se-include, .col-md-12{ }
}
/ Tablets e Smarthphones de segunda geração /
@media screen and (max-width: 780px) and (orientation:portrait){
html{
font-size: 14px;
}
.se-include, .col-md-12{ }
}
/ Desktops, Laptops e TVs. /
@media screen and (min-width: 780px){
html{
font-size: 16px;
}
.se-include, .col-md-8, .col-md-offset-2 { }
}Então... o Seguinte...
Eu preciso que a resolução mude de acordo com o aparelho utilizado, por isso estou usando @media... até ae tudo bem...
Só que, preciso que ao uso em aparelhos de Desktop, Notes e etc... fique com 80% da Resolução, não precisa esticar tudo...
O restante, fique 100%...
Por isso, a ideia seria utilizar a classe "se-include" e ela puxar as outras classes para ela, assim funcionaria do jeito que quero...
Então, na realidade, como eu determino uma classe "pegue" todas as atribuições de outra classe? Nesta caso, Boostrap...
Uma dica: Não precisa dessa "gabiarra" para passar media basta executar @media (TIPO)
Vamos lá: CSS não pode adicionar/remover dados na página, somente pode manipular.
Para que isso funcione .se-include, .col-md-8, .col-md-offset-2
A div deve possuir umas dessas class. Assim sendo se for min-width 780 qualquer resolução acima disso a div portadora dessa class assume suas propriedades.
Agora se for o caso de se-include somente aparecer com essa resolução em uma div qualquer. Isso deve ser feito por intermédio de javascript