Satuan pt merupakan singkatan dari points. Satuan pt (points) pada CSS termasuk salah satu dari satuan absolute dengan nilai yang tetap dan tidak berubah. W3C (WWW Consortium) tidak merekomendasikan satuan pt (points) untuk menampilkan nilai satuan ukuran pada tampilan layar (screen), namun lebih merekomendasikannya sebagai nilai satuan pada piranti mesin cetak seperti printer.
Satuan pt (points) sebesar 12pt jika dikonversikan ke dalam satuan millimeter memiliki nilai sebesar 4.23mm. Besaran nilai 12 pt (points) merupakan 1/6 dari nilai 1 inches atau 1/6 dari 2.54cm.
Sintaks ukuran pt (points) :
tipe_property: npt;
Nilai n adalah nilai dalam bentuk numeric (angka). Nilai n bisa dalam bentuk nilai desimal ataupun non-desimal.
Sebagai contoh :
font-size: 16pt;
width: 220pt;
height: 66pt;
Ukuran huruf atau font size dapat diatur dalam satuan pt (points). Mulai dari satuan terkecil sebesar 1 pt hingga sesuai dengan keinginan dapat anda terapkan untuk menetapkan besaran huruf suatu elemen HTML.
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
<head>
<title>Belajar Style Sheet Pada CSS</title>
</head>
<body>
<p style="font-size:10pt;">Huruf ukuran 10pt</p>
<p style="font-size:12pt;">Huruf ukuran 12pt</p>
<p style="font-size:14pt;">Huruf ukuran 14pt</p>
<p style="font-size:16pt;">Huruf ukuran 16pt</p>
<p style="font-size:18pt;">Huruf ukuran 18pt</p>
<p style="font-size:20pt;">Huruf ukuran 20pt</p>
<p style="font-size:22pt;">Huruf ukuran 22pt</p>
<p style="font-size:24pt;">Huruf ukuran 24pt</p>
</body>
</html>
Hasil Script :
Huruf ukuran 10pt
Huruf ukuran 12pt
Huruf ukuran 14pt
Huruf ukuran 16pt
Huruf ukuran 18pt
Huruf ukuran 20pt
Huruf ukuran 22pt
Huruf ukuran 24pt
Border merupakan batas luar suatu elemen HTML baik itu <div>, <p> dan lainnya. Untuk menetapkan batas luar elemen HTML dalam bentuk garis, anda dapat mengatur opsi jenis border dalam bentuk solid dengan ukuran tertentu dalam satuan pt (points).
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!DOCTYPE html>
<html>
<head>
<title>Belajar Style Sheet Pada CSS</title>
</head>
<body>
<p style="border:solid 1pt #357c3c;">Border ukuran 1pt</p>
<p style="border:solid 2pt #357c3c;">Border ukuran 2pt</p>
<p style="border:solid 3pt #357c3c;">Border ukuran 3pt</p>
<p style="border:solid 4pt #357c3c;">Border ukuran 4pt</p>
<p style="border:solid 6pt #357c3c;">Border ukuran 5pt</p>
<p style="border:solid 7pt #357c3c;">Border ukuran 6pt</p>
<p style="border:solid 8pt #357c3c;">Border ukuran 7pt</p>
<p style="border:solid 9pt #357c3c;">Border ukuran 8pt</p>
<p style="border:solid 10pt #357c3c;">Border ukuran 10pt</p>
</body>
</html>
Hasil Script :
Border ukuran 1pt
Border ukuran 2pt
Border ukuran 3pt
Border ukuran 4pt
Border ukuran 5pt
Border ukuran 6pt
Border ukuran 7pt
Border ukuran 8pt
Border ukuran 10pt
Tutorial CSS
Paling Banyak Dibaca
News Letters
Silahkan masukkan email Anda untuk berlangganan informasi kami
Previous Page
