Estilos de texto
Estilos de texto Você pode usar as seguintes classes para alterar seu texto .font-bold, .font-italic, .font-underline, .font-line-through, .font-overline
Normal
Texto padrão
Bold
Default text
Italic
Default text
Underline
Default text
Line Through
Default text
Overline
Default text
Tamanhos de fonte Você pode usar as classes como nos exemplos abaixo .font-6, .font-10, .font-24
Você pode usar os tamanhos de 6 a 50px. É só adicionar o número ao lado da classe .font-
font-6
font-10
font-12
font-15
font-20
font-24
font-32
font-40
font-42
font-45
font-48
font-50
Alinhamento de texto Você pode usar as classes .align-left, .align-center, .align-right, .align-justify
Alinhamento a esquerda
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Alinhamento centralizado
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Alinhamento a direita
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Alinhamento justificado
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Margens e preenchimento (padding)Você pode usar as classes .m-t-10, .m-t--10, .m-r-5, .p-t-10, .p-b-5
Margens
Margin Top 10px →
.m-t-10
Margin Top 0px →
.m-t-0
Margin Top -10px →
.m-t--10
Margin Left 35px →
.m-l-35
Margin Left 0px →
.m-l-0
Margin Left -35px →
.m-l--35
Margin Bottom 15px →
.m-b-15
Margin Bottom 0px →
.m-b-0
Margin Bottom -20px →
.m-b--20
Margin Right 30px →
.m-r-30
Margin Right 0px →
.m-r-0
Margin Right -30px →
.m-r--30
ALL Margin 0px →
.margin-0
Paddings
Padding Top 10px →
.p-t-10
Padding Top 0px →
.p-t-0
Padding Left 35px →
.p-l-35
Padding Left 0px →
.p-l-0
Padding Bottom 15px →
.p-b-15
Padding Bottom 0px →
.p-b-0
Padding Right 30px →
.p-r-30
Padding Right 0px →
.p-r-0
ALL Padding 0px →
.padding-0
Classes especiais para todos os browsers Quando o usuário inicia o uso desse tema, nós colocamos as informações do navegador dentro da tag html
como uma classe
Insira as classes
.ie10, .ie11, .edge, .opera, .chrome, .firefox, .safari
como classes dentro da tag html
. Após isso você poderá criar novas classes específicas para cada browser.
Exemplo
/* Só irá funcionar no IE10 */
html.ie10 .menu .list {
background-color: #CC0000;
}
/* Só irá funcionar no Google Chrome */
html.chrome .right-sidebar .header {
font-size: 15px;
font-weight: bold;
}