CSS: design méja. conto pendaptaran

Nyieun tabél kalawan CSS - sahiji palajaran metot sarta tanggung jawab. Pendekatan kana bisnis ieu kudu competently, kalawan pangaweruh sagala gaya nu mungkin. Sajaba ti éta, perlu mibanda rasa kaendahan dina urutan teu nyingsieunan kaluar datang kreativitas maranéhanana.

Tabél tiasa transformasi ampir sagalana. Desain geulis ngalibatkeun wates CSS tabel desain, latar tabel, latar sél, celah antara aranjeunna sareng nu sanesna. Mertimbangkeun paling dasar.

wates méja

CSS design gaya tabel salawasna ngalibatkeun kaulinan kalayan wates (bingkai). Kabéh tabel standar henteu contours pigura. Maksudna, eta sarua jeung 0 piksel. Tapi ieu bisa dilereskeun ku wates harta.

Anjeun tiasa nangtukeun pigura luar pikeun sakabéh tabel:

méja {wates: 3px solid hideung; }

Hatur nuhun kana garis ieu pisan tabel kana situs anu ngagunakeun gaya ieu téh pigura hideung. Catet yén ngan wates on edges, tapi teu di jero tabel. Pikeun garis sél na pigura dieusian disebutkeun.

th, TD {wates: 3px solid hideung;}

The ketebalan jeung warna, anjeun tiasa nangtukeun mana wae. Terus di pikiran yén wates teu dua kali lamun splicing sél.

Kecap ngalambangkeun hiji pendaptaran kontinyu padet. Anjeun tiasa nangtukeun nilai lianna.

eta anu paling ilahar dipake pigura padet, sakumaha eta Sigana leuwih pikaresepeun jeung teu ngaganggu perhatian ti eusi utama loka.

sipat wates bisa dieusian ogé di papan tulis. wates nu ngan bisa diatur pikeun luhur, handap, ka kénca atawa sisi katuhu. Kusabab dina sababaraha kasus teu pilihan meujeuhna kalawan pigura pikeun sakabéh tabel sakaligus.

méja {wates-luhur: 1px solid beureum; }

Ku kituna Anjeun tiasa nyetel pigura pikeun luhureun tabel wungkul. Nya kitu keur naon pihak sejen, tinimbang ngan luhureun nulis: katuhu, ka kénca atawa handap.

lulugu méja

lulugu tabel bisa dieusian ngagunakeun tag . tag ieu tiasa di CSS ka ngadaptar loba pasipatan pikeun rupa-tuning. Desain tabel CSS téh alus lantaran kasebut nyaéta dimungkinkeun pikeun maneuver unsur jalan rék.

Judul ieu ditampilkeun dina cara nu sarua salaku baku dina buku (kayaning "Table 1").

Anjeun tiasa nangtukeun lokasi judul jeung harta caption-sisi (luhur atawa handap). Aligning kénca atawa katuhu dihartikeun ku harta téks-align.

tabél tukang

Kasang tukang tabél tiasa wae warna atawa pola. Warna susunan sipat tukang-warna. Ngaran sipat pinuh konsisten kalayan kagunaan dina biantara. Ieu facilitates nyimpen sababaraha kali.

Warna nu bisa dieusian salaku ngaran, sarta encodings béda. Tambahanana, Anjeun bisa netepkeun di handap:

• Transparan - transparan.
• Inherit - Warna sarua yén sahiji unsur indungna.
• Awal - standar.

Pilihan jeung transparansi bisa dipaké dina maranéhanana kasus dimana sakabeh tabel di téks dina file CSS dijieun dina hiji warna, tapi dina hal ieu aya teu kudu.

Sajaba ti éta, latar bisa jadi hiji gambar. Jang ngalampahkeun ieu, dina harta tukang-gambar gaya prescribed. jalur anu kawas kieu:

url ( 'URL')

Jalur pikeun file meureun boh relatif atawa mutlak.

eusian leuwih pajeulit bisa dipigawé kalayan gradién a:

• liniér-gradién ();
• radial-gradién ();
• repeating-linier-gradién () sarta repeating-radial-gradién () - gradién diulang.

sél tukang

Salian latar sacara umum, anjeun tiasa nangtukeun latar belang dina kolom atawa jajar. Pikeun pendaptaran tina harta anu dipaké pisan mindeng, sabab separation visual tina garis gampang maca informasi.

Salian alternation, sarta anjeun bisa nangtukeun jumlah hiji kolom atawa sakaligus tangtu. Contona kawas kieu:

• TR: nth-anak (malah) {...} - tangtukeun interlaced;
• TR: nth-anak (1) {...} - indikasi sipat hiji sakaligus tinangtu;
• TD: nth-anak (malah) {...} - hiji indikasi alik kolom;
• TD: nth-anak (1) {...} - indikasi tina sipat hiji kolom husus.

Di sagigireun runtuyan jeung nomer bisa dieusian - kahiji (TD: kahiji-anak) atanapi tukang (TD: panungtungan-anak).

Celah antara sél

Dina CSS, desain tabel ngidinan Anjeun ngaleupaskeun spasi antara sél. Sacara standar aranjeunna. Contona, lamun disetél pigura dina tabél tanpa netepkeun jarak antara wates, éta bakal di dieu hasilna ieu.

Satuju, éta Sigana moal pisan nice jeung teu merenah pikeun dibaca. Pamaké kudu ripple dina panon kusabab ieu. Dipiceun sela ieu tiasa ku tulisan ngan hiji garis misalna dina gaya tabel:

Wates-runtuhna: runtuhna

Tapi ogé kajadian nu jarakna, sabalikna, kudu dironjatkeun. Leuwih ti éta, ukuran tina sela bisa dieusian salaku antara kolom na antara garis. Pikeun nembongkeun yen nilai a (gaganti ambruk):

Wates-runtuhna: misah

Tapi aksi sapertos bakal nunjukkeun yén perlu misahkeun sél. Nya éta dibagikeun maranéhanana, dituduhkeun sipat tambahan:

Wates-dipasing: 20px.

Mun rék nangtukeun jarak béda antara barisan sarta kolom, éta nunjukkeun dua hal:

Wates-dipasing: 10px20px.

Beda dina panyungsi

Terus di pikiran nu di CSS tabél design bisa kasampak béda, gumantung kana panyungsi dina. Utamana goréng dina kasus kalayan versi heubeul, éta inovasi dina CSS henteu didukung.

Di luhur mangrupa conto pigura thicknesses mun nilai digital.

Contona kieu, anu ketebalan tina pigura pikeun konstanta.

gaya wates ogé bénten greatly.

Ku alatan éta, ngembangkeun sok tingali hasil dina panyungsi béda.

Dina CSS tabel design dianjurkeun pikeun pariksa jinis browser. Utamana masalah badag dipake janten mun pamaké kalayan versi heubeul tina Internet Explorer.

pamekar pisan canggih tiasa, gumantung kana panyungsi pikeun nyambung file CSS lengkep béda. Jeung batur ngajadikeun hiji dipariksa di unggal atawa sababaraha gaya tinangtu (kelas).

Sabagéan Masalah timbul tina bayangan.

CSS: Table Format Conto

Pendaptaran bisa rada variatif. Eta sadayana gumantung kana sakabeh situs jeung desain na. Sadaya kudu digabungkeun jeung kelir variegated. Ogé ngajadikeun peran jeung rasa pamekar hébat. Rasa keindahan anu sagala béda.

Urang masihan sababaraha conto rupa tabel. inohong di luhur mintonkeun pamakean Dengdekkeun sarta maénkeun jeung warna latar jeung wates.

Loba bakal conto metot desain rapih éndah tangka moal potong pamaké panon. perwujudan Ieu luyu ampir sagala situasi.

Edges bisa dijieun rounded. Sigana geulis nice.

kacindekan

Salaku bisa ningali, keur penampilan tabél di CSS aya loba parabot. Unggal parameter ogé jumlah badag pilihan nilai. Lamun make eta sadayana sakaligus, Anjeun bisa nyieun masterpieces. Utamana lamun ngalakukeun design adaptif pikeun sakabéh panyungsi.

Hal utama dina rarancang - teu overdo eta kalawan épék. Sagalana kudu dipigawé di moderation. Awalna, perenah nu resep ékspérimén sarta ngagunakeun sagala pangaweruh maranéhna langsung. Salaku hasil tina tabél anu sipat oversaturated. Coba ulah kasalahan ieu.

Leuwih ti éta, sabagian parameter bisa ngaganggu saling. Contona, aya teu kudu nangtukeun warna latar meja, bari mun aya anu masih diatur gambar latar, anu bakal tumpang tindih dina warna dieusian.