Sintassi

Significato dei valori principali:

• '-': (valore predefinito) Usa il trattino standard.

• '🞄': È possibile usare simboli personalizzati, come punti, emoji ('🞄'), o altri glifi tipografici.

• '...': Si può persino inserire una breve stringa, ma si raccomanda che sia visivamente discreta.

Esempio proprietà: hyphenate-character

Codice Esempio: hyphenate-character

CODE: CSS

1. .custom-hyphen {

2.   width: 300px;

3.   hyphens: auto;

4.   hyphenate-character: '🞄';

5.   text-align: justify;

6.   font-size: 18px;

7.   line-height: 1.6;

8.   background: #f9f9e6;

9.   padding: 10px;

10.   border-radius: 6px;

11. }

Contenuto Esempio: hyphenate-character

  
  <style>
    .custom-hyphen {
      width: 300px;
      hyphens: auto;
      hyphenate-character: '🞄';
      text-align: justify;
      font-size: 18px;
      line-height: 1.6;
      background: #f9f9e6;
      padding: 10px;
      border-radius: 6px;
    }
  </style>

  <div class="custom-hyphen" lang="it">
      Questo è un esperimento con sillabazione automatica...
  </div>
  

⚠️ Note compatibilità:
La proprietà hyphenate-character è supportata in modo limitato nei browser (supporto sperimentale). Attualmente può richiedere flag o impostazioni avanzate nei motori basati su WebKit o Blink. È utile nei contesti controllati (e-book, web app editoriali, progetti sperimentali).

Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.

Supporto Browser