20080328
Altro modo furbo di fare frazioni: http://www.elegio.it/calcolatrice/frazione-bis.html

CSS per fare frazioni e radici

La direttiva di style CSS: border-bottom :1px solid consente di evidenziare solo il lato inferiore della scatola definita dalla marca a cui viene applicato questo stile mentre, similmente, la direttiva CSS: border-top: 1px solid consente di evidenziare il lato superiore della scatola definita dalla marca. Applico questo metodo per realizzare la riga di frazione e la riga di radice.

b

a
a + b·x
c + x · ( 3· d + 7 )
dx   = vale =  
Moltissima
fatica

12 + 34

Si noti che l'intera formula è contenuta in una marca table in modo che in ogni marca td si possano realizzare varie righe automaticamente centrate in base all'altezza dell'intera riga definita dalla marca tr. Si dia una occhiata al sorgente per capire i dettagli del metodo per scrivere formule contenenti linee di frazione e radici.
Ecco la classica formula della soluzione dell'equazione di secondo grado:   a·x2 + b·x + c = 0:

x1,2= −b ± b2 − 4 ·a ·c
2 · a

Sì, un esteta nota che il segno di radice si raccorda male con la sopralineatura.... Per chi vuol qualcosa di meglio ci sarebbe MathML ma a che enorme costo di maggior complicazione!!!
Consiglio inoltre, contrariamente alla convenzione tradizionale, di non scrivere mai moltiplicazioni implicite ma di usare il simbolo · ossia "·" ossia, in UNICODE, ·. Con questo simbolo, meno disturbante dell'asterisco, le formule possono contenere espressioni a molti caratteri e senza ambiguità; ad esempio sin·(3+x) rappresenta inequivocabilmente il prodotto della variabile sin moltiplicato per quanto racchiuso in parentesi mentre sin(3+x) indica chiaramente che si sta facendo uso della funzione sin( ) passandole come argomento 3+x.
Ecco un altro esempio fatto con pochissime marche se confrontato con quanto richiesto da MathML.

 
∂x
x y   =  y ·x y − 1

Per curare l'estetica uso lo spazio bianco invisibile ossia   sia in linea sia come apice o pedice ossia associato alle marche sup o sub.

Modi per sottolineare un blocco di testo

Può inoltre essere indicato il colore della sottolineatura, specificandolo come ultimo dato. Ecco in rosso e blu mentre il testo è a volte anche verde: Sfruttando la possibilità di sottolineatura colorata è possibile ampliare enormemente la varietà dei simboli usabili nelle formule matematiche.

Promemoria di trucchi molto utili

Raccolgo qui, per comodità, qualche trucco utile per gestire bene le pagine HTML con istruzioni CSS.

Visualizzazione sullo schermo diversa da stampa cartacea

Possono essere specificate diverse istruzioni di stile indicando esplicitamente quando vanno applicate. Quando si stampa è comodo, infatti, non mostrare i pulsanti di navigazione e le cose che stampate vengono male. Sul video, per esempio, può colpire molto la scrittura a caratteri bianchi su sfondo scuro o nero ma ovviamente, la stampa deve essere fatta a caratteri scuri su fondo bianco.
Per stabilire che un blocco di istruzioni di stile valgono solo per lo schermo bisogna scrivere:

<style type="text/css" media="screen" >
...omissis...
</style>

mentre le istruzioni che servono solo quando si stampa vanno specificate così:

<style type="text/css" media="print" >
...omissis...
</style>

Salto pagina imposto alla stampante

Per obbligare la stampante a cambiar pagina ci sono due strade ossia imporre che il salto pagina venga effettuato subito prima di un determinato blocco logico oppure subito dopo. Ecco un esempio che mostra come fare nei due modi definendo due classi da usarsi in concomitanza, di solito, con la marca div o p o table.

...omissis...
.saltaprima { page-break-before:always }
.saltadopo { page-break-after:always }
...omissis...

Per usare una delle due classi di stile bisognerà scrivere, per esempio:

...omissis...
<h2 class="saltaprima">Capitolo terzo</h2>
...omissis...

Se si guarda l'anteprima di stampa ci si accorgerà che anche questa pagina HTML applica salti pagina imposti.

Elenco di caratteri speciali utili per scrivere formule

Se questo file venisse considerato un file XML ossia se venisse rinominato usando come estensione .xml invece che .htm o .html sorgerebbero dei problemi perché l'XML, a differenza dell' XHTML, possiede pochissime entità predefinite e dunque non è lecito scrivere, per esempio, &minus; se nel DTD dell' XML non è stata definita esplicitamente l'entità suddetta.
Sarebbe dunque sempre consigliabile (salvo che non si voglia favorire la leggibilità diretta del sorgente) usare gli effettivi valori UNICODE ed evitare di usare entità definite solo in XHTML ma non in XML.
Le tabelle che seguono consentono di conoscere i nomi delle entità di più frequente uso quando si scrivono documenti scientifici con formule matematiche. Per ogni entità viene indicato anche il vero numero di carattere UNICODE in modo da sostituirlo per poter visualizzare anche la struttura logica XML di una pagina XHTML. Ad esempio &times; == &#215; == ×, &bull; == &#8226; == •, &minus; == &#8722; == −.

ISO Latin-1

") &quot;
&#34;
&) &amp;
&#38;
<) &lt;
&#60;
>) &gt;
&#62;
 ) &nbsp;
&#160;
¡) &iexcl;
&#161;
¢) &cent;
&#162;
£) &pound;
&#163;
¤) &curren;
&#164;
¥) &yen;
&#165;
¦) &brvbar;
&#166;
§) &sect;
&#167;
¨) &uml;
&#168;
©) &copy;
&#169;
ª) &ordf;
&#170;
«) &laquo;
&#171;
¬) &not;
&#172;
­) &shy;
&#173;
®) &reg;
&#174;
¯) &macr;
&#175;
°) &deg;
&#176;
±) &plusmn;
&#177;
²) &sup2;
&#178;
³) &sup3;
&#179;
´) &acute;
&#180;
µ) &micro;
&#181;
¶) &para;
&#182;
·) &middot;
&#183;
¸) &cedil;
&#184;
¹) &sup1;
&#185;
º) &ordm;
&#186;
») &raquo;
&#187;
¼) &frac14;
&#188;
½) &frac12;
&#189;
¾) &frac34;
&#190;
¿) &iquest;
&#191;
À) &Agrave;
&#192;
Á) &Aacute;
&#193;
Â) &Acirc;
&#194;
Ã) &Atilde;
&#195;
Ä) &Auml;
&#196;
Å) &Aring;
&#197;
Æ) &AElig;
&#198;
Ç) &Ccedil;
&#199;
È) &Egrave;
&#200;
É) &Eacute;
&#201;
Ê) &Ecirc;
&#202;
Ë) &Euml;
&#203;
Ì) &Igrave;
&#204;
Í) &Iacute;
&#205;
Î) &Icirc;
&#206;
Ï) &Iuml;
&#207;
Ð) &ETH;
&#208;
Ñ) &Ntilde;
&#209;
Ò) &Ograve;
&#210;
Ó) &Oacute;
&#211;
Ô) &Ocirc;
&#212;
Õ) &Otilde;
&#213;
Ö) &Ouml;
&#214;
×) &times;
&#215;
Ø) &Oslash;
&#216;
Ù) &Ugrave;
&#217;
Ú) &Uacute;
&#218;
Û) &Ucirc;
&#219;
Ü) &Uuml;
&#220;
Ý) &Yacute;
&#221;
Þ) &THORN;
&#222;
ß) &szlig;
&#223;
à) &agrave;
&#224;
á) &aacute;
&#225;
â) &acirc;
&#226;
ã) &atilde;
&#227;
ä) &auml;
&#228;
å) &aring;
&#229;
æ) &aelig;
&#230;
ç) &ccedil;
&#231;
è) &egrave;
&#232;
é) &eacute;
&#233;
ê) &ecirc;
&#234;
ë) &euml;
&#235;
ì) &igrave;
&#236;
í) &iacute;
&#237;
î) &icirc;
&#238;
ï) &iuml;
&#239;
ð) &eth;
&#240;
ñ) &ntilde;
&#241;
ò) &ograve;
&#242;
ó) &oacute;
&#243;
ô) &ocirc;
&#244;
õ) &otilde;
&#245;
ö) &ouml;
&#246;
÷) &divide;
&#247;
ø) &oslash;
&#248;
ù) &ugrave;
&#249;
ú) &uacute;
&#250;
û) &ucirc;
&#251;
ü) &uuml;
&#252;
ý) &yacute;
&#253;
þ) &thorn;
&#254;
ÿ) &yuml;
&#255;

Entità addizionali HTML

ƒ) &fnof;
&#402;
Α) &Alpha;
&#913;
Β) &Beta;
&#914;
Γ) &Gamma;
&#915;
Δ) &Delta;
&#916;
Ε) &Epsilon;
&#917;
Ζ) &Zeta;
&#918;
Η) &Eta;
&#919;
Θ) &Theta;
&#920;
Ι) &Iota;
&#921;
Κ) &Kappa;
&#922;
Λ) &Lambda;
&#923;
Μ) &Mu;
&#924;
Ν) &Nu;
&#925;
Ξ) &Xi;
&#926;
Ο) &Omicron;
&#927;
Π) &Pi;
&#928;
Ρ) &Rho;
&#929;
Σ) &Sigma;
&#931;
Τ) &Tau;
&#932;
Υ) &Upsilon;
&#933;
Φ) &Phi;
&#934;
Χ) &Chi;
&#935;
Ψ) &Psi;
&#936;
Ω) &Omega;
&#937;
α) &alpha;
&#945;
β) &beta;
&#946;
γ) &gamma;
&#947;
δ) &delta;
&#948;
ε) &epsilon;
&#949;
ζ) &zeta;
&#950;
η) &eta;
&#951;
θ) &theta;
&#952;
ι) &iota;
&#953;
κ) &kappa;
&#954;
λ) &lambda;
&#955;
μ) &mu;
&#956;
ν) &nu;
&#957;
ξ) &xi;
&#958;
ο) &omicron;
&#959;
π) &pi;
&#960;
ρ) &rho;
&#961;
ς) &sigmaf;
&#962;
σ) &sigma;
&#963;
τ) &tau;
&#964;
υ) &upsilon;
&#965;
φ) &phi;
&#966;
χ) &chi;
&#967;
ψ) &psi;
&#968;
ω) &omega;
&#969;
ϑ) &thetasym;
&#977;
ϒ) &upsih;
&#978;
ϖ) &piv;
&#982;
•) &bull;
&#8226;
…) &hellip;
&#8230;
′) &prime;
&#8242;
″) &Prime;
&#8243;
‾) &oline;
&#8254;
⁄) &frasl;
&#8260;
◊) &loz;
&#9674;
℘) &weierp;
&#8472;
ℑ) &image;
&#8465;
ℜ) &real;
&#8476;
™) &trade;
&#8482;
ℵ) &alefsym;
&#8501;
←) &larr;
&#8592;
↑) &uarr;
&#8593;
→) &rarr;
&#8594;
↓) &darr;
&#8595;
↔) &harr;
&#8596;
↵) &crarr;
&#8629;
⇐) &lArr;
&#8656;
⇑) &uArr;
&#8657;
⇒) &rArr;
&#8658;
⇓) &dArr;
&#8659;
⇔) &hArr;
&#8660;
∀) &forall;
&#8704;
∂) &part;
&#8706;
∃) &exist;
&#8707;
∅) &empty;
&#8709;
∇) &nabla;
&#8711;
∈) &isin;
&#8712;
∉) &notin;
&#8713;
∋) &ni;
&#8715;
∏) &prod;
&#8719;
∑) &sum;
&#8721;
−) &minus;
&#8722;
∗) &lowast;
&#8727;
√) &radic;
&#8730;
∝) &prop;
&#8733;
∞) &infin;
&#8734;
∠) &ang;
&#8736;
∧) &and;
&#8869;
∨) &or;
&#8870;
∩) &cap;
&#8745;
∪) &cup;
&#8746;
∫) &int;
&#8747;
∴) &there4;
&#8756;
∼) &sim;
&#8764;
≅) &cong;
&#8773;
≈) &asymp;
&#8776;
≠) &ne;
&#8800;
≡) &equiv;
&#8801;
≤) &le;
&#8804;
≥) &ge;
&#8805;
⊂) &sub;
&#8834;
⊃) &sup;
&#8835;
⊄) &nsub;
&#8836;
⊆) &sube;
&#8838;
⊇) &supe;
&#8839;
⊕) &oplus;
&#8853;
⊗) &otimes;
&#8855;
⊥) &perp;
&#8869;
⋅) &sdot;
&#8901;
⌈) &lceil;
&#8968;
⌉) &rceil;
&#8969;
⌊) &lfloor;
&#8970;
⌋) &rfloor;
&#8971;
〈) &lang;
&#9001;
〉) &rang;
&#9002;
◊) &loz;
&#9674;
♠) &spades;
&#9824;
♣) &clubs;
&#9827;
♥) &hearts;
&#9829;
♦) &diams;
&#9830;
†) &dagger;
&#8224;
‡) &Dagger;
&#8225;
‰) &permil;
&#8240;
‹) &lsaquo;
&#8249;
›) &rsaquo;
&#8250;
Œ) &OElig;
&#338;
œ) &oelig;
&#339;
Š) &Scaron;
&#352;
š) &scaron;
&#353;
Ÿ) &Yuml;
&#376;
ˆ) &circ;
&#710;
˜) &tilde;
&#732;
‎) &lrm;
&#8206;
‏) &rlm;
&#8207;
–) &ndash;
&#8211;
—) &mdash;
&#151;
‘) &lsquo;
&#8216;
’) &rsquo;
&#8217;
‚) &sbquo;
&#8218;
“) &ldquo;
&#8220;
”) &rdquo;
&#8221;
„) &bdquo;
&#8222;
∆) laplaciano
&#8710;
˙) P.alto
&#729;
‰) &permil;
&#8240;

Esperanto

264:265
Ĉĉ
284:285
Ĝĝ
292:293
Ĥĥ
308:309
Ĵĵ
348:349
Ŝŝ
364:365
Ŭŭ

Per usare la notazione esadecimale invece di quella decimale far precedere ai caratteri esadecimali la "x". Così per esempio, il punto in alto, che in notazione decimale è &#729; può essere scritto anche come &#x2D9; [ che produce ˙ ].

Versori

I simboli con cappelletto sono dei versori ossia vettori di norma unitaria. Purtroppo in Unicode solo alcune lettere hanno la versione con il cappelletto. Le elenco qui:
A-Â-194, a-â-226, C-Ĉ-264, c-ĉ-265, E-Ê-202, e-ê-234, G-Ĝ-284, g-ĝ-285, H-Ĥ-292, h-ĥ-293, I-Î-206, i-î-238, J-Ĵ-308, j-ĵ-309, O-Ô-212, o-ô-244, S-Ŝ-348, s-ŝ-349, U-Û-219, u-û-251, W-Ŵ-372, w-ŵ-373, Y-Ŷ-374, y-ŷ-375.
In tutto quindi 24 simboli di versori.

Segni distintivi

b′-8242, b″-8243. Possibile il cappelletto bˆ-710, e cappelletto capovolto bˇ-711.

Varianti

Per indicare quantità scalari o vettoriali che non implicano la rappresentazione esplicita dei propri versori può essere utile usare simboli con il cappelletto capovolto, dato che sono numerosi in Unicode.
A-Ǎ-461, a-ǎ-462, C-Č-268, c-č-269, D-Ď-270, E-Ě-282, e-ě-283, I-Ǐ-463, i-ǐ-464, N-Ň-327, n-ň-328, O-Ǒ-465, o-ǒ-466, R-Ř-344, r-ř-345, S-Š-352, s-š-353, T-Ť-356, U-Ǔ-467, u-ǔ-468, Z-Ž-381, z-ž-382.
In tutto 10 caratteri minuscoli e 12 caratteri maiuscoli.

I caratteri UNICODE sono elencati in www.unicode.org/charts/.