Je dois maintenir un grand nombre de pages ASP classiques, dont beaucoup ont des données tabulaires sans aucune capacité de tri. Quel que soit l'ordre utilisé par le développeur d'origine dans la requête de base de données, vous êtes coincé.

Je veux insister sur un tri de base pour un tas de ces pages, et je le fais tout côté client avec javascript. J'ai déjà le script de base fait pour trier une table donnée sur une colonne donnée dans une direction donnée, et cela fonctionne bien tant que la table est limitée par certaines conventions que nous suivons ici.

Ce que je veux faire pour l'interface utilisateur est simplement d'indiquer la direction du tri avec le caractère caret (^) et ... quoi? Y a-t-il un caractère spécial qui est l'opposé direct d'un signe d'insertion? La lettre vne le coupera pas tout à fait. Sinon, existe-t-il un autre couple de caractères que je peux utiliser?

Il y a ▲: & # 9650; et ▼: & # 9660;

N'oubliez pas les caractères ∧(logique et) et ∨(logique ou), c'est ce que j'utilise pour indiquer la direction du tri: les entités HTML ∧et ∨respectivement.

Il y a toujours un "v" minuscule. Mais sérieusement, à part Unicode, tout ce que je peux trouver serait &darr, ce qui ressemble à ↓.

Un accent circonflexe à l'envers est appelé un caron ou un háček.

Il a une entité HTML dans l'extension TADS Latin-2 à HTML: ˇet ressemble à ceci: ˇ qui malheureusement ne s'affiche pas dans la même taille / proportion que le ^ caret.

Ou vous pouvez utiliser l'unicode U+30C.

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

 ˅˅˅  Hǝɹǝ, s ɐ ɯɐʇɔɥᴉuƃ sǝʇ˙  ˅˅˅
 Voici  un ensemble correspondant.  ˄˄˄

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

"Taille réelle": ˅˄˅˄  
_{(plus d'infos)}

Edit: une autre option ...

⋁⋁⋁⋁⋁⋁⋁⋁⋁⋁ _{^{Unicode # 8897 / U + 22C1 ( info )}} nommé N-ARY LOGICAL OR

⋀⋀⋀⋀⋀⋀⋀⋀⋀⋀ _{^{Unicode # 8896 / U + 22C0 ( info )}} nommé N-ARY LOGICAL AND

"Taille actuelle": ⋁⋀⋁⋀

Une option puissante - et qui stimule également la créativité - consiste à concevoir vos propres personnages à l'aide de personnages de dessin de boîte .

Vous voulez un "curseur" pointant vers le bas? En voici un: ╲╱

Je les ai récemment découvertes - et je prends beaucoup de plaisir à utiliser ces personnages personnalisés pour étiqueter des choses tout autour :).

Vous pourrez peut-être utiliser les triangles noirs, les valeurs Unicode U + 25b2 et U + 25bc. Ou les flèches, U + 2191 et U + 2193.

code 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

Vous pourriez envisager d'utiliser Font Awesome au lieu d'utiliser l'unicode ou d'autres icônes

Le code peut être aussi simple que (a) y compris police-génial, par exemple <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">(b) faire un bouton tel que<button><i class="fa fa-arrow-down"></i></button>

J'utiliserais quelques petites images. Serait mieux aussi.

Alternativement, vous pouvez essayer l'utilitaire Table des caractères fourni avec Windows ou essayer de regarder ici .

Une autre solution que j'ai vue consiste à utiliser la police Wingdings pour les symboles. Cela a beaucoup de flèches.

J'ai fait des majuscules en indice et en gras V. Cela fonctionne parfaitement (même si cela prend un certain effort, si cela doit être fait de manière répétitive)

Syntaxe:

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

Sortie:
_v

Le ^(Caret - ou Ascii Circumflex), produit en appuyant sur shift+ 6, ne semble pas avoir un Ascii opposé, à savoir un Ascii Inverted Circumflex.

Mais pour votre paire de caractères alternative qui a également des combinaisons de clavier, vous pouvez utiliser:

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

Source: fileformat.info

Il n'y a pas de caractère caret à l'envers, mais vous pouvez facilement faire pivoter le caret avec CSS. Il s'agit d'une solution simple qui semble parfaite. Appuyez sur 'Exécuter l'extrait de code' pour le voir en action:

.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>

Veuillez noter ce qui suit ...

• J'ai fait une petite correction pour le positionnement du curseur, car il est normalement haut (donc bas dans la version pivotée). Vous voulez le déplacer un peu vers le haut. Ce «petit» est relatif à la taille de la police, d'où le «em». Selon votre choix de police, vous voudrez peut-être jouer avec cela pour lui donner une belle apparence.
• Cette solution ne fonctionne pas dans IE8. Vous devez utiliser un filtre si vous souhaitez prendre en charge IE8. La prise en charge d'IE8 n'est pas vraiment requise ni courante en 2018.
• Si vous souhaitez l'utiliser en combinaison avec Twitter Bootstrap, renommez la classe 'caret' en quelque chose d'autre, comme 'caret_down' (car elle entre en collision avec un nom de classe de Twitter Bootstrap).

U + 2304 DOWN ARROWHEAD , en HTML comme & # 8964;

Pourriez-vous simplement dessiner un chemin svg à l'intérieur d'une plage en utilisant document.write? La durée n'est pas requise pour que le svg fonctionne, il garantit simplement que le svg reste en ligne avec le texte à côté duquel le carat est. J'ai utilisé margin-bottom pour le centrer verticalement avec le texte, mais il pourrait y avoir une autre façon de le faire. C'est ce que j'ai fait sur la navigation latérale de mon blog (moins le js). Si vous n'avez pas de texte à côté, vous n'avez pas besoin de l'étendue ou du décalage de la marge inférieure.

<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>

Je voulais donc le curseur exactement comme dans OWA, alors j'ai téléchargé à office365icons.woffpartir de https://owa.example.com/owa/prem/15.1.1913.10/resources/styles/fonts/office365icons.woff(devez être connecté pour le faire, donc je l'ai fait via le navigateur), puis, copiant le style résumé du site Web:

  @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;
  }

Et enfin:

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

Si vous avez besoin de polices géniales pour React Apps, React Icons est une très bonne ressource et très facile à mettre en œuvre. Il comprend beaucoup plus de bibliothèques que simplement génial pour les polices.