Достъпният начин
Най-добре е да гледате 5-минутното видео на Итън и след това да посочите това:
Кръстосаният браузър (допълнителна маркировка)
Просто увийте първия символ на абзаца в интервал, след което насочете интервала с CSS и стил.
L orem ipsum dolor sit amet, consectetur adipiscing elit.
.firstcharacter ( color: #903; float: left; font-family: Georgia; font-size: 75px; line-height: 60px; padding-top: 4px; padding-right: 8px; padding-left: 3px; )Начинът на CSS3 (без допълнително маркиране)
Насочете първия символ на първия абзац, като използвате селектори на псевдо клас. Не са необходими допълнителни маркировки, но няма поддръжка на IE <9.
Just a normal sentence.
p:first-child:first-letter ( color: #903; float: left; font-family: Georgia; font-size: 75px; line-height: 60px; padding-top: 4px; padding-right: 8px; padding-left: 3px; )на initial-letterпътя
По initial-letterвреме на писането поддръжката на браузъра е доста оскъдна, но тя може да се използва за изчисляване на броя на редовете, които трябва да заеме отпадащото писмо, и размера на шрифта, вместо да го правите сами.
p:first-child:first-letter ( color: #903; font-family: Georgia; initial-letter: 2; )Поддръжка на браузър
Тези данни за поддръжка на браузъра са от Caniuse, който има повече подробности. Число показва, че браузърът поддържа функцията на тази версия и по-нова.
работен плот
| Chrome | Firefox | IE | Ръб, край | Сафари |
|---|---|---|---|---|
| Не | Не | Не | Не | TP * |
Мобилен / таблет
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| Не | Не | Не | 14,0-14,4 * |