1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
|
<?xml version="1.0" ?>
<!DOCTYPE article PUBLIC "-//KDE//DTD DocBook XML V4.2-Based Variant V1.1//EN"
"dtd/kdex.dtd" [
<!ENTITY % addindex "IGNORE">
<!ENTITY % Brazilian-Portuguese "INCLUDE"> <!-- change language only here -->
]>
<article>
<articleinfo>
<authorgroup>
<author>&Lauri.Watts; &Lauri.Watts.mail;</author>
<othercredit role="translator"><firstname>Lisiane</firstname> <surname>Sztoltz</surname><affiliation><address> <email>[email protected]</email></address></affiliation><contrib>Tradução</contrib></othercredit>
</authorgroup>
<date>2003-10-12</date>
<releaseinfo>3.2</releaseinfo>
<keywordset>
<keyword>KDE</keyword>
<keyword>CSS</keyword>
<keyword>Folhas de Estilo</keyword>
<keyword>Acessibilidade</keyword>
</keywordset>
</articleinfo>
<sect1 id="stylesheets">
<title>Folhas de Estilo</title>
<sect2>
<title>Introdução</title>
<para>Folhas de estilo <acronym>CSS</acronym> -afetam o modo como as páginas web aparecem. O <acronym>CSS</acronym> é acrônimo para <emphasis>C</emphasis>ascading <emphasis>S</emphasis>tyle <emphasis>S</emphasis>heets (Folhas de Estilo em Cascata).</para>
<para>O &kde; pode usar sua própria folha de estilo, baseado em padrões simples e no esquema de cor que você está usando em seu ambiente de trabalho. O &kde; também pode usar uma folha de estilo que você mesmo escreveu: basta você especificar uma folha de estilo neste módulo. As opções apresentadas estão sintonizadas com outro módulo, especialmente para pessoas com visão reduzida.</para>
<para>Suas escolhas feitas aqui afetam toda aplicação do &kde; que faz renderização HTML, com seu próprio programa chamado tdehtml. Entre as aplicações incluem-se o &kmail;, o &khelpcenter; e é claro, o &konqueror;. As escolhas aqui não afetam outros navegadores, tais como o &Netscape;.</para>
<para>O módulo possui duas abas: <guilabel>Geral</guilabel>, onde você pode escolher quais folhas de estilo usar, e <guilabel>Personalizar</guilabel>, onde você pode projetar uma folha de estilo para o módulo de acessibilidade. </para>
</sect2>
<sect2 id="css-general">
<title>Geral</title>
<para>Esta página contém as seguintes opções:</para>
<variablelist>
<varlistentry>
<term><guilabel>Usar a folha de estilo padrão</guilabel></term>
<listitem>
<para>O &kde; usará a folha de estilo padrão. Algumas das cores irão ser padronizadas para aquelas definidas no seu esquema de cor escolhido. A maioria das configurações são facilmente sobrescritas pela página que você está visualizando.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Usar uma folha de estilo definida pelo usuário</guilabel></term>
<listitem>
<para>O &kde; usará uma folha de estilo escrita por você. Pode-se usar o botão de navegação para localizar o arquivo em seu sistema. Os arquivos <acronym>CSS </acronym> geralmente tem extensão <literal role="extension">.css</literal>, mas isto não é obrigatório.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Usar a folha de estilo de acessibilidade definida na página "Personalizar"</guilabel></term>
<listitem>
<para>Usa as configurações definidas na página <guilabel>Personalizar</guilabel>. Habilitar esta opção irá habilitar as opções na página <guilabel>Personalizar </guilabel>. </para>
</listitem>
</varlistentry>
</variablelist>
</sect2>
<sect2 id="css-customize">
<title>Personalizar</title>
<para>Aqui você pode configurar uma folha de estilo do usuário. As opções disponíveis estão somente em um subconjunto das instruções que você pode adicionar em uma folha de estilo, e elas são feitas para pessoas com problemas de visão, para permitir que usuários possam criar folhas de estilo, que tornam as páginas web e os arquivos de ajuda do &kde; mais fáceis de ler.</para>
<para>As opções desta página estão desabilitadas, a menos que você escolha a opção <guilabel>Usar folha de estilo de acessibilidade definida na página "Personalizar"</guilabel>, contida na página anterior.</para>
<sect3>
<title><guilabel>Família da fonte</guilabel></title>
<variablelist>
<varlistentry>
<term><guilabel>Família de base</guilabel></term>
<listitem>
<para>Escolha uma família de fonte a ser usada para o corpo do texto.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Usar a mesma família para todo o texto</guilabel></term>
<listitem>
<para>Se você habilitar isto, então a mesma família de fonte será usada para todos os textos, apesar das configurações da página que você está vendo. Isto é útil para páginas que usam fontes decorativas ou difíceis de ler.</para>
</listitem>
</varlistentry>
</variablelist>
</sect3>
<sect3>
<title>Tamanho da fonte</title>
<variablelist>
<varlistentry>
<term><guilabel>Tamanho de fonte de base</guilabel></term>
<listitem>
<para>Este é o tamanho padrão para o texto na página. Muitos sites configuram o tamanho de suas fontes baseados neste padrão, usando <quote>maior</quote> ou <quote>+1</quote> para tornar o texto maior e <quote>menor</quote> ou <quote>-1</quote> para tornar o texto menor.</para>
<para>Muitas pessoas projetam suas páginas web em plataformas onde o tamanho padrão do texto é muito grande para leitura, em média, para os usuários. Assim, é muito comum aparecerem páginas que "forçam" fontes menores.</para>
<para>Esta opção permitirá configurar a fonte padrão para um bom tamanho, pois os tamanhos relativos são também aumentados o bastante para que sejam confortáveis de se ler.</para>
<para>Não esqueça que você também pode obrigar o &konqueror; a minimizar o tamanho, pois o texto <emphasis>nunca</emphasis> é muito pequeno de se ler. Configure isto na aba Comportamento, na seção Navegador Web no &kcontrol;.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Usar o mesmo tamanho para todos os elementos.</guilabel></term>
<listitem>
<para>Se você habilitar esta opção, então todo a fonte do texto será modificada para o tamanho especificada, menos as instruções que a página contém. O tamanho relativo de fonte, como discutido anteriormente, deve ser renderizado para um certo tamanho, que será sobrescrito aqui.</para>
</listitem>
</varlistentry>
</variablelist>
</sect3>
<sect3>
<title>Cores</title>
<variablelist>
<varlistentry>
<term><guilabel>Preto sobre Branco</guilabel></term>
<listitem>
<para>Muitas pessoas, com problemas de visão, acham que o texto preto sobre a tela branca fornece mais contraste e é mais fácil de se ler. Se isto se aplica para você, ajuste esta opção aqui.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Branco sobre Preto</guilabel></term>
<listitem>
<para>Muitas outras pessoas, com visão reduzida, acham o oposto verdadeiro: que o texto branco sobre a tela preta é mais fácil de se ler.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Personalizado</guilabel></term>
<listitem>
<para>Ainda, outras pessoas acham que o preto e o branco puros, por outro lado, tornam o texto difícil de se ler. Você pode configurar cores personalizadas tanto para o <guilabel>Fundo</guilabel> como para a frente <guilabel> Cor do texto</guilabel>.</para>
</listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Usar a mesma cor para todo o texto</guilabel></term>
<listitem>
<para>Muitos sites usam uma diferente (freqüentemente contrastante) cor para cabeçalhos ou outros detalhes. Se isto interfere em sua capacidade de ler o conteúdo, você pode habilitar isto nesta caixa de verificação, para que o &kde; use as cores que você ajustou anteriormente, para todo o texto.</para>
</listitem>
</varlistentry>
</variablelist>
</sect3>
<sect3>
<title>Imagens</title>
<variablelist>
<varlistentry>
<term><guilabel>Suprimir as imagens</guilabel></term>
<listitem>
<para>Se você não deseja visualizar imagens, pode desabilitar isto aqui.</para></listitem>
</varlistentry>
<varlistentry>
<term><guilabel>Suprimir as imagens de fundo</guilabel></term>
<listitem>
<para>Um dos maiores problemas para usuários com problemas visuais é que as imagens de fundo não fornecem um contraste suficiente, que permita ler o texto. Você pode desabilitar imagens de fundo aqui, independente da sua escolha anterior de visualizar todas as imagens.</para>
</listitem>
</varlistentry>
</variablelist>
</sect3>
<sect3>
<title>Visualização ...</title>
<para>O botão <guibutton>Visualização</guibutton> permite a você verificar o efeito de suas mudanças. Uma janela irá surgir, mostrando como os vários tipos de cabeçalho aparecerão em sua folha de estilo, bem como uma sentença no corpo do texto.</para>
<para>Isto deve permitir a você fazer um ajuste fino de sua folha de estilo, até que você possua algo confortável para se ler.</para>
<para>Boa navegação!</para>
</sect3>
</sect2>
</sect1>
</article>
|