CSS teksta efektu Špikeris / Cheat sheet
Efekti, ko izstrādātāji izmanto teksta vienumiem tīmekļa lapā, ir izvēlēti galvenokārt to stila un izkārtojuma stila dēļ. Interesantus efektus var izveidot, apvienojot tos ar citiem CSS rekvizītiem.
Teksta satura vizuālo attēlojumu var mainīt ar četrām galvenajām īpašībām: teksta pārveidošana, fonta stils, fonta svars un teksta dekorēšana.
| Parametrs | Vērtība | Apraksts |
|---|---|---|
| Text-transform | None, uppercase, lowercase, capitalize, full-width | Modificē teksta parametrus |
| Font-style | Normal, italic, oblique | Fonta stila opcijas, piemēram, slīpraksts |
| Font-weight | Normal, weight, lighter, bolder, 100-900 | Citas fontu veidošanas iespējas, piemēram, uzsvara maiņa, piemēram, teksta padarīšana treknrakstā |
| Text-decoration | None, underline, overline, line-through | Īsraksts palīgelementiem, kas pievienoti tekstam, izmantojot citus rekvizītus, piemēram, teksta dekorācijas līniju |
Tālāk ir norādīti papildu rekvizīti, kas palīdz konfigurēt stila efektus.
| Teksta līdzināšana | Teksta horizontālai izlīdzināšanai |
|---|---|
| Text-align-last | Līdzinājums pēdējai rindiņai, kad teksts ir iestatīts uz taisnošanu (justify) |
| Text-combine-upright | Viena rakstzīmes vietā ir vairākas rakstzīmes, kas novietotas vertikāli tāpat kā mandarīnu valodā |
| Text-decoration-color | Teksta dekorācijas krāsu konfigurācija |
| Text-decoration-line | Līnijas rakstīšana teksta noformējumā, piemēram, pasvītrojums, pārsvītrojums un tā tālāk |
| Text-decoration-style | Stili, kas pievienoti rindiņām zem teksta, piemēram, viļņaini, punktoti un tā tālāk |
| Text-decoration-thickness | Dekorēšanas līnijas biezums |
| Text-emphasis | Saīsinājums citām īpašībām, piemēram, krāsai un stilam |
| Text-indent | Pirmās rindas atkāpe |
| Text-justify | Norāda attaisnojuma metodi, kas tiek izmantota, ja ir teksta līdzināšana “justify” |
| Text-orientation | Teksta orientācija rindā, piemēram, uz sāniem, vertikāli un tā tālāk |
| Text-shadow | Pievieno tekstam ēnu |
| Text-underline-position | Deklarējiet pasvītrojuma kopas pozīciju, izmantojot teksta dekorēšanas rekvizītu |
Izņemot šos, ir vēl daži rekvizīti, kas palīdz mainīt līdzinājumu un definēt teksta apjomu ar to konteineriem.
| Parametrs | Vērtības | Apraksts |
|---|---|---|
| Text-overflow | Clip, ellipsis | Nosaka teksta pārpildes uzvedību ar konteineru |
| Word-wrap | Normal, anywhere, break-word | Attiecas uz iekļautajiem elementiem, aizstājvārdu pārpildes aplaušanai |
| Word-break | Normal, break-all, keep-all, break-word | Izmanto gariem vārdiem, lai izlemtu, vai vārdiem ir jāpārplūst vai jāpārplūst |
| Writing-mode | Horizontal-tb, vertical-lr, vertical-rl | Var iestatīt teksta virzienu vertikāli vai horizontāli |
Noderīgs raksts? Dalies ar citiem:
Atbildēt
Lai komentētu, jums jāpiesakās sistēmā.