Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boas Pessoal!
Ja adiantando, não manjo nada de webstandards, minha área é programação.
Mas enfim, o professor pediu um projeto onde eu tenho que gerar páginas HTML, baseando-me em arquivos do tipo 'chord'
Que são arquivos de letras de músicas, onde além da letra estão os acordes e algumas outras opções.
Por exemplo, o arquivo:
{title: ChordTPF Song}
{start_of_tab}
Intro: E----------2-----------2-------------3-----------3-------
B--------3---3-------3---3---------3---3-------3---3-----
G------2-------2---2-------2-----0-------0---0-----------
D----0-----------0---------------------------------------
A--------------------------------------------------------
E------------------------------3-----------3------------- (repeat)
{end_of_tab}
{comment: testando o comment loooooool}
[D]Apenas fazendo um [F#]teste
[D]com [d]a [d]geracao de arquivos [F#/A]html
Gera o HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http-~~-//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css"> font-weight: bold;
font-size: 20;
font-family: sans-serif;
}
subtitle {
font-size: 16;
font-family: sans-serif;
text-decoration:underline;
}
tab {
font-family: monospace;
}
chorus {
font-family: serif;
}
comment {
font-style: italic;
}<!-- BEGINING OF AUTOMATIC HTML -->
<title> ChordTPF Song </title>
<style type="text/css"></style>
</head>
<body>
<span style="tab">
<br>
Intro: E----------2-----------2-------------3-----------3-------<br>
B--------3---3-------3---3---------3---3-------3---3-----<br>
G------2-------2---2-------2-----0-------0---0-----------<br>
D----0-----------0---------------------------------------<br>
A--------------------------------------------------------<br>
E------------------------------3-----------3------------- (repeat)<br>
</span>
<br>
<span stype="comment">testando o comment loooooool</span>
<br>
<span style="chord">D F#</span>
<br>
<span style="lyric">Apenas fazendo um teste</span>
<br>
<span style="chord">D d d F#/A</span>
<br>
<span style="lyric">com a geracao de arquivos html</span>
<br>
</body>
</html>O problema é que: eu queria que em '<span style="chord">' os espaços em branco fosse, preservados, para que eu não precise usar no alinhamento dos acordes.
E outra, os estilos não estão sendo mostrados corretamente... quer dizer, não é mostrado estilo nenhum, apenas aparece como texto normal... lol
Valeu! =D
Victor
Use a propriedade **white-spacing** com o valor **pre** que é o mesmo que trocar seu <span> por uma tag <pre>.
O detalhe é que alguns elementos podem válidos dentro de uma tag <span> podem não ser válidos dentro de uma tag <pre>.Perfeito, pessoal! =D
Optei pela solução do Desnickadu, pois o arquivo final fica menor além de que com a tag '<pre>' a fonte é por padrão monospace, o que me facilita a vida.
Enfim, obrigado pelo apoio!
Apenas para constar:
<pre class="c-cifra1024">Introdução: <b>Gm</b> <b>C7</b> <b>F</b> <b>Bb/F</b> <b>F</b> <b>F#°</b>o proprio cifraclub, adotou solução parecida.
http://www.cifraclub.com.br/roberto-carlos/como-grande-meu-amor-por-voce/