Font-family қасиеті

font-family қасиеті қаріп түрін орнатады.

Синтаксис

селектор {
	font-family: қаріп атауы;
}

Ескерту

Егер қаріп атауында бос орындар болса, мысалы, Times New Roman, ол бір немесе қос тырнақшаға алынуы керек.

Ескерту

Үтір арқылы бірнеше ұқсас қаріпті тізіп көрсетуге болады. Браузер тізімдегі бірінші қаріпке кездескенде, ол пайдаланушы компьютерінде оның бар-жоғын тексереді. Егер мұндай қаріп болмаса, тізімнен келесі қаріп алынып, оның да бар-жоғы талданады. Сондықтан бірнеше қаріпті көрсету, олардың кем дегенде біреуінің клиенттік компьютерде табылу ықтималдығын арттырады.

Тізім әдетте қаріп түрін сипаттайтын (барлық қаріптер бір немесе басқа түрге жатады) кілт сөзбен аяқталады - serif, sans-serif, cursive, fantasy немесе monospace. Егер браузер пайдаланушы компьютерінде көрсетілген қаріптердің ешқайсысын таппаса, онда ол көрсетілген түрдегі қаріптердің біреуін таңдайды.

Қаріп түрлері

Түр	Сипаттама
`serif`	Серіптілі қаріп.
`sans-serif`	Серіптісіз қаріп.
`cursive`	Курсивті қаріп.
`fantasy`	Әдемі бұйралармен және ерекше әсерлері бар декоративті қаріп.
`monospace`	Әрбір таңбаның ені бірдей болатын моноширфты қаріп.

Әдепкі мәні: браузерде әдепкі орнатылған қаріп. Әдетте бұл Times New Roman.

Мысал

Қаріпке Arial тұқымдасын тағайындайық:

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: Arial;
}

Мысал

Қаріпке Times New Roman тұқымдасын тағайындайық. Қаріп атауы бірнеше сөзден тұратындықтан, оны тырнақшаға аламыз:

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: "Times New Roman";
}

Мысал

Қаріпке serif тобынан қаріп тағайындайық (ең ықтимал, Times New Roman алынады):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: serif;
}

Мысал

Қаріпке sans-serif тобынан қаріп тағайындайық (ең ықтимал, Arial алынады):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: sans-serif;
}

Мысал

Қаріпке fantasy тобынан қаріп тағайындайық (сізде мұндай қаріп болмағандықтан жұмыс істемейтін болуы мүмкін):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: fantasy;
}

Мысал

Қаріпке monospace тобынан қаріп тағайындайық (әріптер бірдей өлшемде болады):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: monospace;
}