Some text some message..
Some text some message..
Some text some message..
Some text some message..

Satuan Ukuran px (Pixels) Pada CSS

previous Previous Page

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;

Menggunakan Satuan pt (Points) Pada Ukuran Huruf

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

Menggunakan Satuan pt (Points) Pada Border

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

facebooktwitterwhatapplinkedinpinterest

previous Previous Page

Tutorial CSS

News Letters

Silahkan masukkan email Anda untuk berlangganan informasi kami