Acentos nos números em HTML (como A ^ acima de 1)

Question

Estou tentando encontrar a melhor maneira de colocar detalhes circunflexos (ˆ = ˆ) no topo dos números (uma notação musical) sem recorrer a imagens. Certas letras têm entidades HTML equivalentes: ê = ê, Ô = Ô, etc., mas os números não.

Aqui está o que estou usando no meu local na rede Internet:

<span style="position:relative;">1
   <span style="position:absolute; 
                left:0.1em; 
                bottom:0.2em; 
                font-size:1.1em;">
                &circ; 
   </span>  
</span>

Parece muito bom, mas não perfeito-por causa de pequenas diferenças nas formas de números e renderização do navegador, algo está fadado a ficar um pouco fora.

Alguém tem uma solução mais elegante para isso?

Atualizar:

O sotaque circunflexo combinado ̂ ou ̂ Produz resultados diferentes em diferentes navegadores/plataformas, a maioria das quais não está certa (no meu Mac, apenas o Safari faz certo).

De acordo com isto, a exibição adequada de um sotaque de combinação depende da fonte e do renderizador. estou a usar Times New Roman, Times, então não parece ser uma opção viável. Não posso pagar o incômodo e a inevitável ignorando de exigir que um usuário tenha uma fonte específica.

Acho que vou ter que continuar posicionando manualmente o sotaque no topo da nota acima, a menos que haja outras novas respostas. Obrigado.

Atualização 2:

Incorporando uma fonte gratuita com melhor suporte diacítico (especialmente Doulos Sil) parecia promissor, mas a partir de agora (novembro de 2009), o Chrome não suporta @font-face no CSS por padrão. Uma vez, porém, será ótimo, já que os outros navegadores já estão a bordo. webfonts.info é o local para informações sobre isso.

Answer 1

Se a renderização da marca de combinação não for suficientemente boa, acho que você teria que invadir o posicionamento.

<style>
    .over { position: relative; }
    .over span { position: absolute; top: -0.5em; left: 0; }
</style>

abc <span class="over">1<span>^</span></span> xyz

Ainda um hack desagradável! Mas possivelmente menos trabalho do que mathml.

Answer 2

U+0302 COMBINING CIRCUMFLEX ACCENT

Faça um com mapa de personagens ou com a entidade

 ̂

Coloque um sobre o que quiser, colocando -o depois:

ê Â 1̂ ̂

Torna-se

ê 1̂ ̂

... mas não foi projetado para passar por cima do 1 ou do rosto sorridente. Observe como subiu mais alto para o A, mas não para o 1 ou o rosto sorridente.

Answer 3

Tente o Combinando sotaque circunflexo (U+0302) usando ̂ ou ̂:

1̂

Exemplo:

1̂

Answer 4

Muito dependerá se a fonte que seu usuário está usando suporta esse recurso. Como você não pode incorporar fontes em uma página da web (sem algum problema legal em potencial), sua melhor aposta é experimentar as sugestões acima com fontes diferentes para determinar se o personagem que você procura é suportado. Depois de encontrar uma fonte, faça referência no arquivo CSS e informe ao usuário que é necessária uma fonte específica para visualizar corretamente seu site.

Tente usar o seguinte índice Unicode: http://www.fileformat.info/info/unicode/char/a.htm

Você precisará saber o nome do personagem que está tentando exibir. Depois de encontrá -lo, a página de informações informará como exibir o caractere usando os códigos de caracteres HTML.

Answer 5

Confira o Combinando marcas diacríticas Perguntas frequentes. Um circunflex de combinação é U+0302.

Essa seção diz: "Algumas fontes, como as Doulos e as fontes da Charis, que estão disponíveis gratuitamente para download, contêm grandes repertórios de glifos pré -compostos apropriados". Pode valer a pena tentar fazer com que seus usuários baixem essas fontes (se eles funcionarem).

Você pode ter algum sucesso diminuindo o número:

<span style="font-size: 75%">1</span>&#x0302;