Om du är ny till att designa webbsidor med HTML och CSS , kanske du inte inser hur stor kontroll designers har över textstorlek , jämfört med vad som fanns tillgängligt vid födelsen av webben . I själva verket kan de tillgängliga alternativen för teckenstorlekar vara nästan förvirrande . En mängd olika sätt är tillgängliga för att kontrollera storleken på de typsnitt som visas på en webbsida. Detta är oftast gjort med CSS ( Cascading Style Sheets ) snarare än den gamla metoden med att skriva varje stil i varje textrad i HTML ( Hyper Text Markup Language ) -fil . Kodformat med CSS
När du använder CSS , kan du definiera mycket specifika teckenstorlekar och tillämpa dem på grupper av text , som du anger med taggar . Du kan antingen skapa en extern CSS-fil och bifoga det till HTML- fil som innehåller innehållet på din sida , eller så kan du inkludera interna CSS -koder i huvudet på HTML-filen . Oavsett vilken metod du föredrar , ser den grundläggande koden för inställning av teckenstorlek så här :
h1 { font - size : 40px ; }
Detta innebär att all text som du anger som " h1 " i HTML-filen kommer att ha en storlek på 40 pixlar . Om du har problem med textstorlek som visas här storleken , se etiketten öppnas och stängs med klammerparenteser . Kontrollera även att värdet slutar med ett semikolon , och att inget utrymme mellan siffran värdet och " px . "
Standard Type Taggar
Vanligtvis en designer använder header -taggar för att ange olika teckenstorlekar han kan behöva hela webbplatsen . Traditionellt dessa taggar börjar med
, vilket är den största teckenstorleken finns på sidan , ner till , vilket kan vara mycket liten text i en sidfot . Den
definierar typisk brödtext som visas i punkterna . Du kan ställa in alla dessa individuella storlekar i CSS -formatmallen , sedan omsluta texten skriven i din HTML med taggar .
Använda absoluta värden
Du kan ställa in teckenstorlek i ett absolut värde , som pixlar , millimeter eller tum , som i följande exempel :
p { font - size : 14 pt ; }
Detta ställer teckenstorlek för all text innanför
som 14 poäng . Detta är ett exempel på absolut dimensionering, där texten storlek förblir en fast storlek . Vissa webbläsare kan du ändra den här storleken , vilket är till hjälp för dem med nedsatt syn som behöver öka textstorleken för att läsa den . Däremot tillåter Internet Explorer inte dig att öka storleken med denna kodning . Addera Använda relativa värden
Många designers använder relativa värden för att ändra teckenstorlekar . Detta ställer textstorleken i förhållande till andra element och låter dig ändra storlek på alla webbläsare . Relativa värden inkluderar pixlar , procentsatser och EMS. Ems är enheten rekommenderas av World Wide Web Consortium ( W3C ) . En mätning av 1 em motsvarar standardstorleken på ett teckensnitt i en webbläsare , vilket är 16 pixlar . Du kan ange teckenstorlekar i EMS med följande kod :
h2 { font - size : 1.875em ; }
grund av pågående problem med kompatibilitet i Internet Explorer , rekommenderar W3C en kombination av procentsatser och EMS att se som standard en bildupplevelse som möjligt i alla webbläsare . De rekommenderar följande kod för att sätta en standard storlek font :
body { font - size : 100 % ; }
och ange sedan dina olika rubrik och storlekar punkt baserad bort av det :
h1 { font - size : 2.25em ; }
p { font - size : 0.8em ; } Addera
