Efectul despre care vorbesc este:
Acest efect se poate obtine foarte usor cu putin css si html in felul urmator:
- luam prima litera din paragraf si ii punem o clasa folosind tagul span.
- apoi mergem in fisierul css si adaugam
Asta e tot.
Mai este o varinta care ar fi mult mai simpla, doar ca nu merge in versiunile 6,7,8 de IE, care arata cam asa:
- se adauga urmatorul cod in css
Acelasi cod de css ca cel de mai sus doar ca se folosesti o clasa mai speficica care este inteleasa de Chrome, Firefox si IE 9.
Acest efect se poate obtine foarte usor cu putin css si html in felul urmator:
- luam prima litera din paragraf si ii punem o clasa folosind tagul span.
Cod:
<p>
<span class="firstcharacter">L</span> orem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique lobortis orci ac lacinia. Fusce eu purus eget diam vehicula auctor nec eu elit. Morbi consequat facilisis orci vel malesuada. Donec ultrices molestie sollicitudin. Aliquam pharetra libero enim. Donec et suscipit massa. Donec dui odio, dignissim non sodales et, tincidunt a sapien. Phasellus elit nibh, adipiscing sed blandit vel, interdum et arcu.
</p- apoi mergem in fisierul css si adaugam
Cod:
.firstcharacter {
float: left; color: #903;
font-size: 75px;
line-height: 60px;
padding-top: 4px;
padding-right: 8px;
padding-left: 3px;
font-family: Georgia;
Asta e tot.
Mai este o varinta care ar fi mult mai simpla, doar ca nu merge in versiunile 6,7,8 de IE, care arata cam asa:
- se adauga urmatorul cod in css
Cod:
p:first-child:first-letter {
float: left;
color: #903;
font-size: 75px;
line-height: 60px;
padding-top: 4px;
padding-right: 8px;
padding-left: 3px;
font-family: Georgia;
}Acelasi cod de css ca cel de mai sus doar ca se folosesti o clasa mai speficica care este inteleasa de Chrome, Firefox si IE 9.