Cascading Style Sheets: Perbedaan antara revisi

{{infoboxInfobox file format

| name = Cascading Style Sheets (CSS)

| extension = .css

| screenshoticon = [[Berkas:CSSCSS3 logo and wordmark.svg|160px100px]]

Sama halnya ''styles'' dalam [[aplikasi]] pengolahan kata seperti [[Microsoft Word]] yang dapat mengatur beberapa ''style'', misalnya ''heading'', ''subbab'', ''bodytext'', ''footer'', ''images'', dan ''style'' lainnya untuk dapat digunakan bersama-samasecara bersamaan dalam beberapa berkas (''[[file]]'').<ref name="Slamet">Slamet Riyanto, ''Membuat Web Portal Multi Bahasa Jomla 1.5X + CD'', halaman 236. Elex Media Komputindo.</ref> Pada umumnya CSS dipakaidigunakan untuk memformat tampilan halaman web yang dibuat dengan [[bahasa]] [[HTML]] dan [[XHTML]].<ref name="Slamet"/>

CSS dapat mengendalikan [[ukuran]] [[gambar]], [[warna]] bagian tubuh pada teks, warna [[tabel]], ukuran border, warna border, warna [[hyperlink]], warna ''[[mouse]] over'', spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya.<ref name="Slamet"/> CSS adalah bahasa [[Stylesheet|style sheet]] yang digunakan untuk mengatur tampilan dokumen.<ref name="dominikus">Dominikus Juju & Matamaya Studio, ''Seri Penuntun Praktis Join Multiply'', halaman 95. Elex Media Komputindo.</ref> Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda.<ref name="dominikus"/>

== Sejarah CSS ==

Untuk saat ini terdapat dua versi CSS, yaitu CSS1 dan CSS2.<ref name="dominikus"/> CSS 1 dikembangkan berpusat pada pemformatan dokumen [[HTML]], sedangkan CSS 2CSS2 dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa ditampilkan di [[printer]].<ref, sedangkan CSS3 adalah versi terbaru dari CSS yang mampu name="dominikus"/>melakukan banyak hal dalam desain website.

Saat masuk pada bagian CSS, sering dijumpai [[kode]] sebagai berikut:

<sourcesyntaxhighlight lang="css">

h1body {

color: #0789deblack;

}

CSS didefinisikan langsung pada tag HTML yang bersangkutan. CaraIni penulisannya cukupditulis dengan menambahkan atribut '''style="..."''' dalam tag HTML tersebut.<ref name="css_html">Untung Rahardja, Augury El Rayeb, & Asep Saefullah (2009). ''Siapa saja bisa membuat website dengan CSS dan HTML'', halaman 37-41. Andi Yogyakarta.</ref> StyleGaya hanya akan berlaku pada tag yang bersangkutan, dan tidak akan mempengaruhimemengaruhi tag HTML yang lain.<ref name="css_html" />

<sourcesyntaxhighlight lang="html4strict" line="1">

<title>Contoh Bentuk Inline</title>

<p id="cth3cth2" style="font-size:14pt; color:red20pt">

Tag P ini diformat dengan besar font 1420 point, dan menggunakan warna merah </p>

=== EmbeddedInternal Style SheetCSS ===

CSS didefinisikan terlebih dahulu dalam tag '''<style> ... </style>''' di atasdalam tag '''<bodyhead>'''.<ref name="css_html" /><ref>{{Cite Pada pendefinisian ini disebutkan atribut-atributweb|title=How CSS yangis akanstructured digunakan untuk tag-tag HTML,Learn yangweb selanjutnyadevelopment dapat{{!}} digunakan oleh tag HTML yang bersangkutanMDN|url=https://developer.<ref namemozilla.org/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured|language="css_html"en-US|access-date=2024-09-23}}</ref>

<sourcesyntaxhighlight lang="html4stricthtml5" line="1">

<title>Contoh Bentuk Embedded</title>

<h1 id="cth1">Judul ini berukuran 18 dengan warna merah!</h1>

<p id="cth2">Tag p ini di format dengan besar font 12 point dengan tipe font Arial dan mempunyai identasiindntasi 0.5 inchinci
</p>

<p id="cth3">Yang perlu diperhatikan juga bahwa body disini telah diformat dengan margin kiri 0.5 inch dan warna
background biru</p>

=== LinkedExternal Style SheetCSS ===

p {

=== PranalaGrouping luarSelector pada CSS ===

[[Kategori:StandarBahasa W3Cskrip|CSS]]