Eu tenho que manter um grande número de páginas ASP clássicas, muitas das quais com dados tabulares sem nenhum recurso de classificação. Qualquer que seja a ordem que o desenvolvedor original usou na consulta ao banco de dados, você está preso.

Quero abordar algumas classificações básicas em várias dessas páginas, e estou fazendo tudo do lado do cliente com javascript. Eu já tenho o script básico feito para classificar uma determinada tabela em uma determinada coluna em uma determinada direção e funciona bem desde que a tabela seja limitada por certas convenções que seguimos aqui.

O que eu quero fazer para a interface do usuário é apenas indicar a direção da classificação com o caractere de sinal de intercalação (^) e ... o quê? Existe um caractere especial que é o oposto direto de um sinal de intercalação? A carta vnão será suficiente. Como alternativa, existe outro par de caracteres que posso usar?

Há ▲: & # 9650; e ▼: & # 9660;

Não se esqueça dos caracteres ∧(lógico e) e ∨(lógico ou), é isso que eu uso para indicar a direção da classificação: entidades HTML ∧e ∨respectivamente.

Sempre há um "v" minúsculo. Mas, falando sério, além do Unicode, tudo o que posso encontrar seria &darr, que se parece com ↓.

Um circunflexo de cabeça para baixo é chamado de caron ou háček.

Ele tem uma entidade HTML na extensão TADS Latin-2 para HTML: ˇe se parece com isto: ˇ que infelizmente não é exibido no mesmo tamanho / proporção que o ^ acento circunflexo.

Ou você pode usar o unicode U+30C.

˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅˅

 ˅˅˅  Hǝɹǝ, s ɐ ɯɐʇɔɥᴉuƃ sǝʇ˙  ˅˅˅
 Aqui  está um conjunto de correspondência.  ˄˄˄

˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄˄

"Tamanho real": ˅˄˅˄  
_{(mais informações)}

Editar: Outra opção ...

⋁⋁⋁⋁⋁⋁⋁⋁⋁⋁ _{^{Unicode # 8897 / U + 22C1 ( informações )}} chamado N-ARY LOGICAL OR

⋀⋀⋀⋀⋀⋀⋀⋀⋀⋀ _{^{Unicode # 8896 / U + 22C0 ( informações )}} chamado N-ARY LOGICAL AND

"Tamanho atual": ⋁⋀⋁⋀

Uma opção poderosa - e que também aumenta a criatividade - é criar seus próprios personagens usando caracteres de desenho de caixa .

Deseja um sinal de intercalação? Aqui está um: ╲╱

Eu os descobri recentemente - e tenho muito prazer em usar esses caracteres personalizados para rotular as coisas por toda a parte :).

Você pode usar os triângulos pretos, os valores Unicode U + 25b2 e U + 25bc. Ou as setas, U + 2191 e U + 2193.

código c #

int i = 0;
char c = '↑';
i = (int)c;
Console.WriteLine(i); // prints 8593

int j = 0;
char d = '↓';
j = (int)d;
Console.WriteLine(j); // prints 8595

Você pode considerar usar o Font Awesome em vez de usar o unicode ou outros ícones

O código pode ser tão simples quanto (a) incluindo fontes impressionantes, por exemplo <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">(b) criar um botão como<button><i class="fa fa-arrow-down"></i></button>

Eu usaria duas pequenas imagens. Ficaria melhor também.

Como alternativa, você pode experimentar o utilitário Mapa de Caracteres que acompanha o Windows ou procurar aqui .

Outra solução que eu vi é usar a fonte Wingdings para símbolos. Isso tem muitas flechas.

Subscrevi capital maiúsculo e negrito V. Funciona perfeitamente (embora seja necessário algum esforço, se for necessário repetidamente)

Sintaxe:

<sub><strong>v</strong></sub>

Saída:
_v

O ^(Caret - ou Ascii Circumflex), produzido pressionando shift+6 , não parece ter um Ascii oposto, a saber, um Ascii Inverted Circumflex.

Mas, para o seu emparelhamento de caracteres alternativo que também possui combinações de teclado, você pode usar:

ˆ (Circumflex) shift+ alt+ ie
ˇ (Caron) shift+alt +t

Fonte: fileformat.info

Não há um caractere de intercalação invertido, mas você pode facilmente girar o intercalação com CSS. Esta é uma solução simples que parece perfeita. Pressione 'Executar snippet de código' para vê-lo em ação:

.upsidedown {
transform:rotate(180deg); 
-webkit-transform:rotate(180deg);
-o-transform:rotate(180deg);
-ms-transform:rotate(180deg);
}
.upsidedown.caret {
display: inline-block; 
position:relative; 
bottom: 0.15em;
}

more items <span class="upsidedown caret">^</span>

Por favor observe o seguinte...

• Fiz uma pequena correção para o posicionamento do cursor, pois ele é normalmente alto (portanto baixo na versão rotacionada). Você quer subir um pouco. Este 'pequeno' é relativo ao tamanho da fonte, daí o 'em'. Dependendo da sua escolha de fonte, convém mexer com isso para fazer com que pareça bom.
• Esta solução não funciona no IE8. Você deve usar um filtro se desejar suporte ao IE8. O suporte ao IE8 não é realmente necessário nem comum em 2018.
• Se você quiser usar isso em combinação com o Twitter Bootstrap, renomeie a classe 'caret' para outra coisa, como 'caret_down' (pois ela colide com um nome de classe do Twitter Bootstrap).

U + 2304 PARA BAIXO NA SETA , em HTML como & # 8964;

Você poderia simplesmente desenhar um caminho svg dentro de um intervalo usando document.write? A extensão não é necessária para o svg funcionar, apenas garante que o svg permaneça alinhado com o texto ao qual o quilate está próximo. Usei a margem inferior para centralizá-lo verticalmente com o texto, embora possa haver outra maneira de fazer isso. Foi o que fiz no navegador do lado do meu blog (menos os js). Se você não tiver texto ao lado, não precisará do intervalo ou do deslocamento da margem inferior.

<div id="ID"></div>

<script type="text/javascript">
var x = document.getElementById('ID');

// your "margin-bottom" is the negative of 1/2 of the font size (in this example the font size is 16px)
// change the "stroke=" to whatever color your font is too
x.innerHTML = document.write = '<span><svg style="margin-bottom: -8px; height: 30px; width: 25px;" viewBox="0,0,100,50"><path fill="transparent" stroke-width="4" stroke="black" d="M20 10 L50 40 L80 10"/></svg></span>';
</script>

Então, eu queria o sinal de intercalação exatamente como no OWA, então baixei office365icons.woffde https://owa.example.com/owa/prem/15.1.1913.10/resources/styles/fonts/office365icons.woff(preciso fazer o login para fazê-lo, o fiz através do navegador) e, em seguida, copiei o estilo resumido do site:

  @font-face {
      font-family: 'Office365Icons';
      src: url('/fonts/office365icons.woff') format('woff');
      font-weight: normal;
      font-style: normal;
  }

  span.o-icon {
      font-family: 'Office365Icons';
      font-size: 14pt;
      line-height: 21px;
      color: #666;
  }

E finalmente:

<span class="o-icon">&#xe088;</span>

Se você está precisando de fontes incríveis para o React Apps, o React Icons é um recurso muito bom e fácil de implementar. Inclui muito mais bibliotecas do que apenas incríveis fontes.