Aqui encontra-se uma breve descrição das propriedades CSS utilizadas e disponíveis nesse Guia. A base utilizada para a criação do CSS foi Boostrap 3, portanto é primordial que haja um conhecimento prévio do framework ao utilizar os códigos presente nesse documento.
bradseg_styles.min.css Download
Arquivo CSS principal que contempla todos os componentes listados nesse guia.
Esse arquivo deve ser carregado no head de todas as páginas.
Importante! Esse arquivo não pode ser alterado. Caso seja necessário adaptações de classes específicas recomenda-se criar um arquivo CSS separado que deverá sobrescrever essas propriedades.
bradseg_black_white.min.css Download
Arquivo CSS responsável pela acessibilidade P&B do site. Ele sobrescreve todas as cores do CSS principal para tons de cinza.
Todas as páginas devem possuir uma tag como abaixo:
<link rel="stylesheet" data-href="../style/accessibility/bradseg_black_white.min.css" id="bradsegBlackWhite"/>
O atributo data-href deve conter o endereço da localização do bradseg_black_white.min.css. A substituição desse CSS será feito via JS. Para mais informações visitar a sessão acessibilidade na página JS.
bradseg_high_contrast.min.css Download
Arquivo CSS responsável pela acessibilidade em alto contraste do site. Ele sobrescreve todas as cores do CSS principal para fundo preto e textos em branco.
Todas as páginas devem possuir uma tag como abaixo:
<link rel="stylesheet" data-href="../style/accessibility/bradseg_high_contrast.min.css" id="bradsegHighContrast"/>
O atributo data-href deve conter o endereço da localização do bradseg_black_white.min.css. A substituição desse CSS será feito via JS. Para mais informações visitar a sessão acessibilidade na página JS.
styles.min.css Download
Arquivo CSS principal que contempla todos os componentes listados nesse guia.
Esse arquivo deve ser carregado no head de todas as páginas.
Importante! Esse arquivo não pode ser alterado. Caso seja necessário adaptações de classes específicas recomenda-se criar um arquivo CSS separado que deverá sobrescrever essas propriedades.
Os alinhamentos podem definir a posição de um texto ou elemento.
text-left
A classe text-left aplica a propriedade text-align: left. É utilizada para alinhar o texto à esquerda.
text-right
A classe text-right aplica a propriedade text-align: right. É utilizada para alinhar o texto à direita.
text-center
A classe text-center aplica a propriedade text-align: center, É utilizada para alinhar o texto ao centro.
text-justify
A classe text-justify aplica a propriedade text-align: justify, É utilizada para alinhar o texto justificado.
elem-left
A classe elem-left aplica a propriedade float: left. É utilizada para alinhar um elemento à esquerda.
elem-right
A classe elem-right aplica a propriedade float: right.É utilizada para alinhar um elemento à direita.
elem-center
A classe elem-center aplica a propriedade margin: 0 auto. É utilizada para alinhar um elemento à centro.
elem-clear
A classe elem-clear aplica a propriedade clear: both. É utilizada para eliminar os efeitos de float de um elemento.
Abaixo algumas classes criadas que agilizam o desenvolvimento.
margin0 - Aplica a propriedade margin: 0. É utilizada para remover a margem dos quatro lados de um elemento.
l-margin15 - Aplica a propriedade margin-left: 15px. É utilizada para definir a margem esquerda do elemento em 15px.
r-margin15 - Aplica a propriedade margin-right: 15px. É utilizada para definir a margem direita do elemento em 15px.
padding0 - Aplica a propriedade padding: 0. É utilizada para remover o padding dos quatro lados de um elemento.
full-width -Aplica a propriedade width: 100%, é utilizada para definir a largura de um elemento em 100%.