| Betűtípusok : !Egyedi betűtípus használata honlapodon 2. |
!Egyedi betűtípus használata honlapodon 2.
Egy tutorial, ami arról szól, hogyan tudsz egyedi betűtípust használni a weboldaladon úgy, hogy az másnál is ugyan úgy nézzen ki :) És mivel ezt is már sokan kérdeztétek, így hoztam kettő féle leírást erről is. Ez az egyik, a másikat pedig itt olvashatod el.
Töltsd fel a betűtípusodat a netre. Lehet G-Portálra is a tárkezelőbe vagy HTML oldalra is. Ha feltöltötted, akkor az URL címét másold be a CSS kód azon részébe, amit kiemeltem.
Arra kell vigyázni, hogy olyan betűtípust válassz, ami magyar ékezetes!!!!!!!!!!!!!!
Ezt a kódot kell beillesztened oldalad egyszerű moduljába jobb vagy bal oldalra forráskód nézetbe:
<style type="text/css">
@font-face {
font-family: Lora; /* betűtípusod neve. Ide írd a nevét */
src: url(//aranymeli.gportal.hu/portal/aranymeli/upload/285733_1343296957_00096.ttf); /* betűtípusod URL címe. Ahova feltöltötted a betűdet */
}
--></style>
Ha ez megvan, akkor a CSS kódban tűntessük fel a betűtípust, ahol használni szeretnénk.
Itt egy példa CSS kód. Ez a modulfejlécre hat és a modulban lévő szövegre:
<style type="text/css">
td.modtitle { /* modulfejléc része */
font-family: 'Lora', cursive;
font-size: 18px;
color: #f4e6cb;
text-align: center;
background-color: #ba6066;
padding-top: 7px; /* keret és a szöveg közti távolság */
padding-bottom: 4px; /* keret és a szöveg közti távolság */
border-left: #ecddc1 1px solid;
border-right: #ecddc1 1px solid;
border-bottom: #e2d4bd 0px solid;
border-top: #ecddc1 1px solid;
-moz-border-radius: 0em 0em 0em 0em; /* a keret szélek kerekítése */
-webkit-border-radius: 0em 0em 0em 0em; /* a keret szélek kerekítése */
font-weight: bold;
text-transform: none;
font-style: normal;
}
td.modbody { /* modulban a szöveg elrendezése, modul háttere */
background-color: #f8ecd4;
font-family: 'Lora', cursive;
font-size: 13px;
color: #5f5f5f;
padding-left: 5px; /* keret és a szöveg közti távolság */
padding-right: 5px;
padding-bottom: 4px;
border-left: #ecddc1 1px solid;
border-right: #ecddc1 1px solid;
border-bottom: #ecddc1 1px solid;
border-top: #e2d4bd 0px none;
-moz-border-radius: 0em 0em 0em 0em;
-webkit-border-radius: 0em 0em 0em 0em;
}
--></style>
Ha több betűtípust szeretnél alkalmazni a CSS kódban, akkor a fő kód ilyesmi lesz. Egymás alá kerülhetnek a betűk nevei és url címei. A CSS kódodba pedig azt a nevet írod, amelyiket éppen használni szeretnél :)
<style type="text/css">
@font-face {
font-family: Gnuolane; /* betűtípusod neve. Ide írd a nevét */
font-family: Duality; /* másik betűtípusod neve. Ide írd a nevét */
src: url(//aranymeli.gportal.hu/portal/aranymeli/upload/285733_1314645458_03651.ttf); /* betűtípusod URL címe. Ahova feltöltötted a betűdet */
src: url(//aranymeli.gportal.hu/portal/aranymeli/upload/285733_1314645460_06548.ttf); /* másik betűtípusod URL címe. Ahova feltöltötted a betűdet */
}
--></style>
| 
AJÁNLOM AZ OLDALT
Súgó
Frissítés