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 10px
Huruf ukuran 12px
Huruf ukuran 14px
Huruf ukuran 16px
Huruf ukuran 18px
Huruf ukuran 20px
Huruf ukuran 22px
Huruf ukuran 24px
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 1px
Border ukuran 2px
Border ukuran 3px
Border ukuran 4px
Border ukuran 5px
Border ukuran 6px
Border ukuran 7px
Border ukuran 8px
Border ukuran 10px
Tutorial CSS
Paling Banyak Dibaca
News Letters
Silahkan masukkan email Anda untuk berlangganan informasi kami
Previous Page
