Nilai apa yang dapat diambil oleh properti perataan teks. Properti CSS text-decoration, vertical-align, text-align, text-indent untuk dekorasi teks dalam Html

Halo para pembaca yang budiman dari situs blog. Dalam artikel ini, kami terus menjelajahi dasar-dasar penataan CSS dan melihat perataan vertikal, perataan teks, indentasi teks, dan beberapa properti lainnya untuk menata teks html.

Menyejajarkan teks dengan CSS

Mari kita mulai dengan atribut gaya yang mengontrol rendering teks dalam elemen blok. Mari kita mulai dengan properti text-align, yang sebenarnya merupakan pengganti dari atribut align (digunakan untuk menyelaraskan konten dari elemen html seperti paragraf p).

Properti gaya text-align tanya perataan teks horizontaldan hanya memiliki empat kemungkinan nilai:

Nilai yang tersedia untuk aturan ini menentukan perataan, masing-masing: kiri - ke kiri, kanan - ke kanan, tengah - ke tengah, dan rata - dengan lebar halaman (secara bersamaan ke kiri dan ke kanan dengan menambah jarak antar kata). Misalnya, teks dalam artikel ini diratakan dengan lebar halaman (jika Anda melihatnya memiliki batas yang rata di kiri dan kanan) menggunakan aturan text-align: justify.

Secara default, perataan horizontal diratakan kiri, jadi Anda tidak perlu secara khusus menentukan perataan teks: kiri jika tidak ada perataan lain yang ditentukan di elemen induk.

Contoh penggunaan properti:

Properti CSS berikutnya text-ident tanya lekukan untuk garis merah, misalnya untuk teks di tag paragraf p. Aturan ini, seperti text-align, hanya berlaku untuk elemen blok. Sintaksis:

Nilai indentasi absolut dan relatif diperbolehkan di sini. Nilai absolut (px - piksel, em, ex, dll.) Dapat ditentukan dengan tanda plus atau minus. Nilai relatif biasanya diberikan sebagai persentase (%). Nilai relatif dihitung dari lebar area teks. Jadi, indentasi teks aturan css: 50% akan menyetel garis merah sama dengan setengah panjang garis itu sendiri. Secara default, indentasi "garis merah" adalah nol. Contoh:

Selanjutnya, mari kita lihat perataan vertikal - properti perataan vertikal... Properti ini sudah berlaku untuk semua elemen html dan untuk hampir semua cara penyelarasan elemen sebaris dengan teks relatif terhadap garis dasarnya. Kecuali untuk tag tabel td dan th, di mana semua konten akan disejajarkan secara vertikal. Sintaksis:

Mari pertimbangkan setiap nilai secara lebih rinci:

baseline - perataan bagian teks dengan garis dasar elemen induk. Ini adalah defaultnya;
sub - sepotong teks ditampilkan sebagai subskrip atau subskrip untuk elemen induk;
super - sepotong teks ditampilkan sebagai superskrip atau superskrip untuk elemen induk;
atas - meratakan bagian teks ke atas elemen induk;
text-top - meratakan fragmen ke tepi atas teks elemen induk;
middle - meratakan tengah fragmen teks ke tengah elemen induk;
bottom - meratakan bagian teks ke bagian bawah elemen induk;
text-bottom - perataan fragmen ke tepi bawah teks elemen induk;

Gambar di bawah ini menunjukkan perilaku fragmen uji dengan nilai berbeda dari properti perataan vertikal di Internet Explorer 11:

Selain nilai di atas, Anda dapat menentukan nilai numerik. Misalnya, aturan CSS perataan vertikal: 0 akan berarti sama dengan penulisan perataan vertikal: baseline. Dan aturan vertical-align: 10px akan memindahkan teks ke atas 10 piksel dari garis dasar. Untuk memindahkan teks ke bawah, nilai harus ditentukan dengan minus.

Offset juga dapat ditentukan dalam unit relatif, seperti em dan ex, atau sebagai persentase.

Untuk meratakan konten sel tabel secara vertikal, gunakan nilai berikut:

atas - untuk meratakan konten ke atas sel;
bawah - untuk menyelaraskan konten ke bagian bawah sel;
tengah - untuk meratakan ke tengah sel (digunakan secara default).

Untuk mencapai hasil yang diinginkan, Anda biasanya harus bereksperimen dengan nilai yang berbeda untuk properti gaya perataan vertikal. Banyak kemungkinan nilai memberikan hasil yang terlalu berbeda dalam kasus yang berbeda.

Opsi spasi putih dan bungkus kata untuk mengontrol jeda baris

Baris berikutnya adalah parameter white-space, yang bertanggung jawab untuk menampilkan karakter spasi pada halaman html.

Seperti yang kita ketahui, secara default, browser menggabungkan semua karakter spasi putih yang berurutan: spasi, jeda baris, dan tab, menjadi satu spasi. Pengecualian tag awal, teks yang ditempatkan di dalamnya ditampilkan sebagaimana adanya, dengan semua spasi.

Properti white-space memiliki sintaks berikut:

Jelas bahwa nilai normal digunakan secara default dan membiarkan semuanya seperti yang dijelaskan di atas, semua spasi yang berurutan digabungkan menjadi satu dan jeda baris diatur secara otomatis.

Menggunakan nilai "pre" akan sama dengan menggunakan tag "pre". Browser akan merender halaman dengan spasi ekstra dan tanda hubung seperti yang ditambahkan oleh pengembang. Jika baris teks terlalu panjang, bilah gulir horizontal akan ditambahkan.

Nilai nowrap mencegah browser membungkus baris dan teks ditampilkan dalam satu baris. Satu-satunya hal, menambahkan tag "br" akan memungkinkan Anda untuk membungkus teks pada baris baru.

Nilai pra-bungkus mempertahankan semua urutan spasi dan jeda baris, tetapi jika garis tidak pas dengan area yang ditentukan, browser secara otomatis membungkus teks pada baris baru.

Nah, nilai pra-baris mengubah spasi menjadi satu spasi, feed baris disimpan, dan browser mungkin memutus garis yang terlalu panjang untuk menghindari pengguliran horizontal.

Contoh penggunaan:

Pertimbangkan selanjutnya parameter kata-bungkus, yang akan memberi tahu Anda apakah harus membungkus kata-kata panjang yang tidak pas di area tertentu atau tidak. Properti ini jarang digunakan, tetapi terkadang Anda tidak dapat melakukannya tanpanya:

word-wrap: normal | break-word

Nilai normal memberi tahu browser bahwa teks hanya dapat dipisahkan pada spasi, dan ini adalah perilaku normal browser. Dan nilai break-word memungkinkan browser memasukkan jeda baris di dalam kata. Contoh:

Parameter bayangan teks - properti bayangan-teks

Untuk penggemar berbagai hiasan dalam standar CSS3, menjadi mungkin untuk mengatur bayangan untuk teks. Penggunaan yang tepat dari properti text-shadow dapat menganimasikan halaman web dengan jelas. Sintaksis:

Nilai none membatalkan bayangan teks dan disetel secara default.

Warna teduh diatur dalam format CSS yang tersedia dan merupakan parameter opsional. Secara default, warna bayangan sama dengan warna teks.

Offset horizontal bayangan dapat ditentukan dalam satuan ukuran apa pun yang didukung oleh CSS. Nilai positif akan menempatkan bayangan di sebelah kanan teks, dan nilai negatif di sebelah kiri. Nilai nol akan memposisikan bayangan tepat di bawah teks dan hanya masuk akal jika bayangan diburamkan.

Offset vertikal bayangan juga dapat diatur dalam satuan ukuran apa pun yang didukung oleh CSS. Nilai positif akan memindahkan bayangan di bawah teks; nilai negatif akan memindahkannya ke atas. Nilai nol akan menempatkan bayangan tepat di bawah teks.

Dalam setiap unit pengukuran, dan radius blur bayangan... Semakin tinggi nilainya, semakin lebar bayangannya dan semakin halus. Jika parameter ini tidak disetel, nilai blur dianggap nol. Karena algoritme anti-aliasing biasanya berbeda untuk browser yang berbeda, tampilan bayangan mungkin sedikit berbeda bergantung pada browser.

Modul Teks css mendeskripsikan fungsi CSS yang mengontrol terjemahan teks sumber menjadi teks berformat dan pembungkusan baris. Berbagai properti CSS memberikan kontrol atas konversi kasus, penanganan spasi, teks dan aturan pembungkusan dan pembungkusan baris, perataan, spasi, dan indentasi.

Unit dasar teks adalah simbol. Namun, karena sistem penulisan tidak selalu sesederhana alfabet bahasa Inggris arus utama, apa sebenarnya simbol itu bergantung pada konteks di mana istilah tersebut digunakan. Misalnya, dalam sistem penulisan Korea, setiap bujur sangkar dari sebuah suku kata (misalnya, 한 \u003d han) dapat dianggap sebagai simbol. Namun, simbol persegi memang terdiri dari beberapa huruf, masing-masing mewakili fonem (misalnya, for \u003d h, ㅏ \u003d a, n \u003d n), dan masing-masing juga dapat dianggap sebagai simbol.

1. Transformasi teks: properti text-transform

Properti text-transform akan memberi gaya pada teks. Ini tidak mempengaruhi konten yang mendasarinya, dan itu tidak mempengaruhi konten dari operasi salin dan tempel teks biasa.

Properti ini diwarisi.

Sintaksis

Transformasi teks: tidak ada; text-transform: capitalize; text-transform: huruf besar; text-transform: huruf kecil; text-transform: mewarisi; teks-transformasi: awal;

2. Menangani spasi dan jeda baris: properti ruang putih

Properti white-space menangani spasi antara kata dan jeda baris dalam sebuah elemen.

Properti ini diwarisi.

ruang putih
Nilai:
normal	Nilai default. Hanya satu spasi yang disisipkan di antara kata-kata, spasi tambahan dibuang. Teks dibungkus hanya jika perlu.
nowrap	Mencegah jeda baris kecuali jika diterapkan .
pra	Spasi dalam teks tidak diabaikan, browser menampilkan spasi ekstra dan jeda baris.
bungkus sebelumnya	Mempertahankan spasi dalam teks dengan membuat jeda baris jika diperlukan.
pra-baris	Menghapus spasi ekstra kecuali dalam kasus .
ruang istirahat	Perilakunya identik dengan pre-wrap, kecuali bahwa: urutan whitespace yang tidak dapat dilepas selalu menggunakan ruang, termasuk di akhir baris; Jeda baris ada setelah setiap spasi yang tidak dapat dilepas, termasuk antar spasi.
awal
mewarisi

Sintaksis

Ruang-putih: normal; ruang putih: nowrap; ruang putih: pra; spasi: pra-bungkus; white-space: pre-line; ruang-putih: ruang-istirahat; white-space: mewarisi; spasi: awal;

3. Tab pengaturan: properti ukuran-tab

Properti ukuran tab digunakan untuk mengubah jumlah indentasi yang diperoleh dengan tombol Tab. Nilai properti diabaikan ketika salah satu dari tiga nilai pra-baris, normal, atau nowrap dari properti ruang-putih disetel.

Hanya berfungsi untuk elemen dan <pre>Untuk elemen blok lainnya, nilainya akan selalu satu. Nilai properti yang ditentukan dalam satuan panjang hanya didukung di Chrome 42+.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Ukuran tab: 0; ukuran-tab: 10px; ukuran-tab: mewarisi; ukuran-tab: awal;</p><h3>4. Jeda baris dan batas kata</h3> <p>Ketika konten tingkat garis dipecah menjadi beberapa baris, itu dipecah menjadi blok linier. Pemisahan ini disebut jeda baris.</p> <p>Ketika jeda baris karena kontrol jeda baris eksplisit seperti baris baru atau tag <br> , awal atau akhir blok adalah pemutusan baris paksa.</p> <p>Jika jeda baris karena pembungkusan konten saat browser membuat jeda baris opsional agar sesuai dengan konten, itu adalah pembungkusan lembut.</p> <h4>4.1. Aturan istirahat huruf: properti kata-istirahat</h4> <p>Properti word-break mendefinisikan kemungkinan soft wrap antar huruf, mis. jika baris teks boleh dipisahkan. Secara khusus, ini mengontrol apakah ada tanda hubung lembut antara huruf tipografi dan / atau angka yang berdekatan. Ini tidak memengaruhi aturan yang mengatur kemampuan tanda hubung lunak yang dibuat oleh spasi.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Istirahat kata: normal; kata-istirahat: break-all; kata-istirahat: simpan-semua; kata-istirahat: mewarisi; kata-istirahat: awal;</p><h4>4.2. Jeda baris: jeda baris</h4> <p>Properti jeda baris menentukan aturan untuk jeda baris yang diterapkan dalam elemen, khususnya bagaimana jeda baris berinteraksi dengan tanda baca dan karakter.</p> <p>Properti ini diwarisi.</p> <table class="t1"><tr><th colspan="2">line-break</th> </tr><tr><td>Nilai:</td> <td> </td> </tr><tr><td> mobil</td> <td>Browser menentukan sekumpulan batasan jeda baris untuk digunakan, yang dapat bervariasi berdasarkan panjang baris, seperti menggunakan sekumpulan aturan jeda baris yang tidak terlalu ketat untuk baris pendek. Nilai default.</td> </tr><tr><td> longgar</td> <td>Memisahkan teks menggunakan kumpulan aturan penggabungan baris yang paling tidak ketat. Biasanya digunakan untuk kalimat pendek, seperti di koran.</td> </tr><tr><td> normal</td> <td>Membagi teks menggunakan kumpulan aturan penggabungan baris yang paling umum.</td> </tr><tr><td> ketat</td> <td>Memecah teks menggunakan seperangkat aturan jeda baris yang ketat.</td> </tr><tr><td> awal</td> <td>Setel nilai properti ke nilai defaultnya.</td> </tr><tr><td> mewarisi</td> <td>Mewarisi nilai properti dari elemen induk.</td> </tr></table><p><b>Sintaksis</b></p><p>Jeda baris: otomatis; baris-istirahat: longgar; jeda baris: normal; baris-baris: ketat; baris-jeda: mewarisi; baris-jeda: awal;</p><h4>4.3. Tanda hubung: properti tanda hubung</h4> <p>Properti tanda hubung menentukan apakah tanda hubung diizinkan untuk membuat kemampuan tanda hubung lembut dalam satu baris teks.</p> <p>Tanda hubung adalah pemecahan kata terkontrol, di mana kata-kata biasanya tidak diperbolehkan untuk istirahat untuk memperbaiki tata letak paragraf. Biasanya, pemisahan kata terjadi di sepanjang batas suku kata atau morfemik dan dengan indikasi visual pemisahan (biasanya dengan menyisipkan tanda hubung, -). Dalam beberapa kasus, tanda hubung juga dapat mengubah ejaan kata. Bagaimanapun, pembungkus kata hanyalah efek rendering: itu tidak akan mempengaruhi konten dokumen, pemilihan teks atau pencarian.</p> <p>CSS Text Level 3 tidak menentukan aturan tanda hubung yang tepat, jadi Anda disarankan untuk memilih titik tanda hubung yang sesuai untuk bahasa Anda.</p> <p>Properti ini diwarisi.</p> <table class="t1"><tr><th colspan="2">tanda hubung</th> </tr><tr><td>Nilai:</td> <td> </td> </tr><tr><td> tidak ada</td> <td>Kata tidak diberi tanda hubung, meskipun karakter dalam kata tersebut secara eksplisit menentukan tanda hubung.</td> </tr><tr><td> manual</td> <td>Kata-kata diberi tanda hubung hanya di tempat-tempat di mana ada karakter di dalam kata yang dengan jelas menunjukkan kemungkinan kata hyphenation (karakter khusus -). Nilai default.</td> </tr><tr><td> mobil</td> <td>Kata-kata dapat dibagi menjadi kemampuan tanda hubung, seperti yang ditentukan secara otomatis oleh sumber daya tanda hubung yang sesuai dengan bahasa, selain yang secara eksplisit ditunjukkan oleh tanda hubung. Anda perlu menyetel bahasa konten Anda (misalnya, menggunakan atribut HTML lang atau header HTTP Content-Language) untuk mendapatkan pembungkusan kata otomatis yang tepat.</td> </tr><tr><td> awal</td> <td>Setel nilai properti ke nilai defaultnya.</td> </tr><tr><td> mewarisi</td> <td>Mewarisi nilai properti dari elemen induk.</td> </tr></table><p><b>Sintaksis</b></p> <p>Tanda hubung: tidak ada; tanda hubung: manual; tanda hubung: otomatis; tanda hubung: mewarisi; tanda hubung: awal;</p><h4>4.4. Wrap-block overflow: properti overflow-wrap / word-wrap</h4> <p>Properti overflow-wrap (atau nama yang sudah tidak berlaku lagi word-wrap) menentukan apakah baris yang tidak terputus bisa putus pada titik yang belum terselesaikan untuk mencegah kotak baris meluap. Berfungsi ketika properti ruang putih memungkinkan pembungkusan.</p> <p>Properti ini diwarisi.</p> <table class="t1"><tr><th colspan="2">overflow-wrap, word-wrap</th> </tr><tr><td>Nilai:</td> <td> </td> </tr><tr><td> normal</td> <td>Garis yang tidak putus hanya dapat diputus pada break point yang diizinkan. Nilai default.</td> </tr><tr><td> kata istirahat</td> <td> </td> </tr><tr><td> dimana saja</td> <td>Urutan karakter yang bersebelahan dapat diputus pada titik arbitrer jika tidak ada titik putus lain yang dapat diterima di baris tersebut. Mempengaruhi tampilan visual saja, tanpa mempengaruhi teks asli. Tidak ada baris baru yang ditambahkan pada titik istirahat baris. Opsi bungkus lembut yang disediakan di mana saja dipertimbangkan saat menghitung ukuran konten minimum Anda sendiri.</td> </tr><tr><td> awal</td> <td>Setel nilai properti ke nilai defaultnya.</td> </tr><tr><td> mewarisi</td> <td>Mewarisi nilai properti dari elemen induk.</td> </tr></table><p><b>Sintaksis</b></p><p>Overflow-wrap: normal; overflow-wrap: break-word; overflow-wrap: di mana saja; overflow-wrap: mewarisi; overflow-wrap: awal;</p><h3>5. Sejajarkan dan ratakan garis</h3> <p>Perataan garis dan kontrol perataan bagaimana konten sebaris didistribusikan dalam kotak garis.</p> <h4>5.1. Catatan singkat untuk meratakan teks: properti text-align</h4> <p>Blok teks adalah kumpulan blok linier. Properti text-align menentukan properti text-align-all dan text-align-last dan menjelaskan bagaimana kotak tingkat garis di setiap kotak baris diratakan dengan sisi awal dan akhir kotak garis. Nilai selain justify-all atau match-parent ditetapkan ke text-align-all dan reset ke text-align-last ke auto.</p> <p>Properti ini diwarisi.</p> <table class="t1"><tr><th colspan="2">text-align</th> </tr><tr><td>Nilai:</td> <td> </td> </tr><tr><td> Mulailah</td> <td>Konten tingkat garis disejajarkan dengan tepi awal kotak garis. Nilai default.</td> </tr><tr><td> akhir</td> <td>Konten tingkat garis disejajarkan dengan tepi belakang kotak garis.</td> </tr><tr><td> kiri</td> <td>Konten tingkat garis diratakan ke kiri dari garis kotak garis. Dalam sistem penulisan vertikal, ini akan menjadi fisik atas atau bawah, tergantung pada orientasi teks.</td> </tr><tr><td> Baik</td> <td>Konten tingkat garis diratakan ke kanan pada kotak garis dari kotak garis. Dalam sistem penulisan vertikal, ini akan menjadi fisik atas atau bawah, tergantung pada orientasi teks.</td> </tr><tr><td> pusat</td> <td>Konten tingkat garis dipusatkan di dalam kotak garis.</td> </tr><tr><td> membenarkan</td> <td>Teks disejajarkan dengan lebar kotak garis untuk mengisi kotak garis secara akurat, bersandar di tepi kiri dan kanan elemen induk. Kecuali ditentukan lain dalam text-align-last, baris terakhir sebelum pemutusan paksa atau akhir blok diratakan ke awal. Spasi antara kata dan huruf terdistribusi sehingga panjang semua baris sama. Browser yang berbeda dapat meningkatkan jarak antar kata dan antar huruf.</td> </tr><tr><td> membenarkan-semua</td> <td>Menyetel text-align-all dan text-align-last untuk meratakan, juga meratakan baris terakhir.</td> </tr><tr><td> orang tua yang cocok</td> <td>Nilai berperilaku sama seperti mewarisi, kecuali bahwa nilai awal atau akhir yang diwarisi diinterpretasikan relatif terhadap nilai arah (atau blok asli yang berisi jika tidak ada induk) dan menghasilkan nilai yang dihitung dari kiri atau kanan.</td> </tr><tr><td> mewarisi</td> <td>Mewarisi nilai properti dari elemen induk.</td> </tr></table><p><b>Sintaksis</b></p><p>Perataan teks: mulai; text-align: end; teks-rata: kiri; text-align: right; text-align: center; text-align: justify; text-align: justify-all; text-align: match-parent; text-align: mewarisi;</p><h4>5.2. Perataan teks default: properti text-align-all</h4> <p>Properti text-align-all adalah versi singkat dari properti text-align yang menentukan perataan dari semua baris konten dalam wadah blok, kecuali untuk baris terakhir, yang diganti oleh text-align-last. Menerima nilai mulai, akhir, kiri, kanan, tengah, rata, dan pasangan-pasangan.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Text-align-all: start; text-align-all: end; text-align-all: left; text-align-all: right; text-align-all: center; text-align-all: justify; text-align-all: match-parent; text-align-all: inherit;</p><h4>5.3. Ratakan baris terakhir: properti text-align-last</h4> <p>Properti text-align-last mendeskripsikan bagaimana baris terakhir dari sebuah blok atau garis diratakan tepat sebelum pemutusan garis paksa.</p> <p>Jika disetel ke otomatis, konten pada baris yang sesuai akan disejajarkan dengan perataan-teks-semua, kecuali justify disetel untuk perataan-teks-semua, dalam hal ini ia disejajarkan dengan awal blok. Semua nilai lainnya diinterpretasikan seperti yang dijelaskan untuk perataan teks.</p> <p>Nilainya adalah auto, start, end, left, right, center, justify, dan match-parent.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Teks-rata-terakhir: otomatis; text-align-last: mulai; text-align-last: end; text-align-last: kiri; text-align-last: kanan; text-align-last: center; text-align-last: justify; text-align-last: match-parent;</p><h3>6. Kesenjangan</h3> <p>CSS memungkinkan Anda untuk mengontrol jarak antara kata dan karakter tipografi menggunakan properti spasi kata dan spasi huruf.</p> <h4>6.1. Spasi antar kata: properti word-spacing</h4> <p>Properti penspasian kata menentukan penspasian tambahan antar kata. <br> Mengatur jarak antar kata. Nilai positif dan negatif dapat digunakan. Dengan makna negatif, kata-kata bisa tumpang tindih.</p> <p>Nilai penspasian kata dipengaruhi oleh nilai properti perataan teks saat teks rata.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Spasi kata: normal; spasi kata: 1px; spasi kata: 0.2em; spasi kata: 50%; spasi kata: mewarisi; spasi kata: awal;</p><h4>6.2. Pelacakan: properti spasi-huruf</h4> <p>Properti spasi-huruf menentukan spasi tambahan, atau pelacakan, antara karakter tipografi yang berdekatan. Penspasian huruf melengkapi dan spasi kata. Agen pengguna selanjutnya dapat menambah atau mengurangi jarak antara unit karakter tipografi untuk meratakan teks, tergantung pada aturan perataan yang ada.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Penspasian huruf: normal; spasi huruf: 0.1em; spasi huruf: 2px; spasi huruf: mewarisi; spasi huruf: awal;</p><h3>7. Indentasi baris pertama: properti teks-indentasi</h3> <p>Properti indentasi teks menentukan indentasi yang diterapkan ke baris konten sebaris dalam blok. Padding diperlakukan sebagai margin yang diterapkan ke tepi awal kotak garis. <br> Jika ada gambar di baris pertama elemen blok, gambar tersebut akan bergerak bersama dengan teks lainnya.</p> <p>Properti ini diwarisi.</p> <p><b>Sintaksis</b></p><p>Indentasi teks: 5mm; teks-indentasi: 20px; indentasi teks: 5%; teks-indentasi: 2em setiap baris; teks-indentasi: 2em gantung; text-indent: mewarisi; teks-indentasi: awal;</p> <p>Mengatur perataan baris terakhir dari sebuah blok teks.</p><h2>informasi singkat</h2><h2>Penunjukan</h2><table><tbody><tr><th> </th><th>Deskripsi</th><th style="width: 130px">Contoh</th> </tr><tr><td><тип> </td><td>Menunjukkan jenis nilai.</td><td><размер> </td> </tr><tr><td>A && B</td><td>Nilai harus ditampilkan dalam urutan yang ditampilkan.</td><td><размер> && <цвет> </td> </tr><tr><td>A | B</td><td>Menunjukkan bahwa hanya satu dari nilai yang disarankan yang harus dipilih (A atau B).</td><td>normal | topi kecil</td> </tr><tr><td>A || B</td><td>Setiap nilai dapat digunakan sendiri atau bersama-sama dengan nilai lain dalam urutan apa pun.</td><td>lebar || menghitung</td> </tr><tr><td> </td><td>Nilai kelompok.</td><td>[tanaman || menyeberang]</td> </tr><tr><td>* </td><td>Ulangi nol kali atau lebih.</td><td>[,<время>]* </td> </tr><tr><td>+ </td><td>Ulangi satu kali atau lebih.</td><td><число>+ </td> </tr><tr><td>? </td><td>Jenis, kata, atau grup yang ditentukan adalah opsional.</td><td>sisipan?</td> </tr><tr><td>(A, B)</td><td>Ulangi setidaknya A, tetapi tidak lebih dari B kali.</td><td><радиус>{1,4} </td> </tr><tr><td># </td><td>Ulangi satu kali atau lebih, dipisahkan dengan koma.</td><td><время># </td> </tr></tbody></table>× <h2>Nilai</h2><p>auto Mencocokkan perataan yang ditentukan oleh properti text-align, kecuali untuk nilai justify. Untuk itu, perataan akan menjadi seperti awal. start Garis ini sejajar dengan tepi awal blok, yang dapat bervariasi tergantung pada arah teks (kiri ke kanan atau kanan ke kiri). ujung Garis sejajar dengan tepi ujung blok, itu ditentukan oleh arah teks. kiri Garis rata kiri. kanan Garis rata kanan. center Garis tengah. justify String dijustifikasi. Jika hanya ada satu kata di baris terakhir, maka kata itu akan dibiarkan rata.</p><p>Pengaruh nilai yang berbeda pada posisi teks ditunjukkan pada tabel. satu.</p><table class="data"> Tab. 1. Pengaruh nilai text-align-last <tr><th>Nilai</th><th>Penjajaran</th><th>Jenis teks</th> </tr><tr><td class="sel">kiri</td><td>Rata kiri</td><td> </td> </tr><tr><td class="sel"> Baik</td><td>Tepi kanan</td><td><img src='https://i2.wp.com/webref.ru/assets/images/css/css_text-align-last_2.png' height="127" width="161" loading=lazy></td> </tr><tr><td class="sel">pusat</td><td>Pusat</td><td><img src='https://i0.wp.com/webref.ru/assets/images/css/css_text-align-last_3.png' height="127" width="161" loading=lazy></td> </tr><tr><td class="sel">membenarkan</td><td>Dengan lebar</td><td><img src='https://i0.wp.com/webref.ru/assets/images/css/css_text-align-last_4.png' height="127" width="161" loading=lazy></td> </tr></table><h2>Bak pasir</h2><p>Winnie the Pooh selalu tidak segan-segan dengan sedikit penyegaran, apalagi pada pukul sebelas pagi, karena saat ini sarapan sudah lama berakhir, dan makan malam pun belum terpikir untuk dimulai. Dan, tentu saja, dia sangat senang melihat Kelinci mengeluarkan cangkir dan piring.</p><p>div (text-align-last: start;)</p><h2>Contoh</h2><p><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>text-align-last</title> <style> div { width: 300px; text-align: justify; text-align-last: justify; } </style> </head> <body> <div> Saat melintasi pegunungan, bersandarlah di lembah; posisikan diri Anda di ketinggian, tergantung di mana sisi cerahnya. Saat melawan lawan yang berada di atas bukit, jangan langsung naik. Ini adalah watak tentara di pegunungan.</div> <script type="text/javascript">  </script><br> <br> </body> </html></p><h2>Model Objek</h2><p><i>Sebuah Objek</i>.style.textAlignLast</p><h2>Catatan</h2><p>Internet Explorer dan Edge tidak mendukung nilai awal dan akhir.</p><p>Firefox versi 49 mendukung properti -moz-text-align-last.</p><h2>Spesifikasi</h2><p>Setiap spesifikasi melewati beberapa tahap persetujuan.</p><ul><li>Rekomendasi - Spesifikasi ini didukung oleh W3C dan direkomendasikan sebagai standar.</li><li>Rekomendasi Kandidat ( <span>Rekomendasi yang memungkinkan</span>) - grup yang bertanggung jawab atas standar merasa puas karena sejalan dengan tujuannya, tetapi diperlukan bantuan komunitas pengembang untuk menerapkan standar.</li><li>Rekomendasi yang Diusulkan ( <span>Rekomendasi yang disarankan</span>) - Pada titik ini, dokumen tersebut diserahkan ke Dewan Penasihat W3C untuk persetujuan akhir.</li><li>Working Draft - Versi draft yang lebih matang setelah diskusi dan amandemen untuk review komunitas.</li><li>Draf editor ( <span>Draf editorial</span>) - versi draf standar setelah diedit oleh editor proyek.</li><li>Minuman ( <span>Spesifikasi draf</span>) adalah draf pertama standar.</li> </ul>× <p><b>Tag HTML mendefinisikan perataan teks, indentasi</b></p> <p><b>Teks yang dibenarkan digunakan dalam tipografi</b></p> <p>Contoh di bawah ini menunjukkan cara menyelaraskan <b>teks menjadi lebar</b> halaman:</p> <table class="t_align" cellspacing="2"><tr><th> align \u003d "left"</th> <th> align \u003d "right"</th> </tr><tr><td> </td> <td><p>Jumlah pekerja yang bekerja di sektor jasa dan penyebaran informasi terus bertambah setiap hari. Jika pertanian dan pabrik merupakan simbol dari abad yang lalu, maka simbol abad 21 saat ini adalah sebuah kantor yang dilengkapi dengan komputer yang memiliki akses ke arus informasi.</p> </td> </tr><tr><th> align \u003d "justify"</th> <th> align \u003d "center"</th> </tr><tr><td><p>Jumlah pekerja yang bekerja di sektor jasa dan penyebaran informasi terus bertambah setiap hari. Jika pertanian dan pabrik merupakan simbol dari abad yang lalu, maka simbol abad 21 saat ini adalah sebuah kantor yang dilengkapi dengan komputer yang memiliki akses ke arus informasi.</p> </td> <td><p>Jumlah pekerja yang bekerja di sektor jasa dan penyebaran informasi terus bertambah setiap hari. Jika pertanian dan pabrik merupakan simbol dari abad yang lalu, maka simbol abad 21 saat ini adalah sebuah kantor yang dilengkapi dengan komputer yang memiliki akses ke arus informasi.</p> </td> </tr></table><p>Nilai justify memastikan seragam <b>ratakan teks ke kanan dan kiri</b>, mis <b>lebarnya</b>... Metode ini banyak digunakan di media cetak.</p> <h2>Menyejajarkan teks di tengah dan lebar HTML</h2> <p><b>Rata tengah teks dalam HTML, teks ke kanan</b>:</p> <p>Hasil:</p> <p>Atribut dan nilai</p> <ul><li>align \u003d "left" - mendefinisikan <i>ratakan teks ke kiri</i> (default).</li> <li>align \u003d "center" - <i>meratakan teks ke tengah</i>.</li> <li>sejajarkan \u003d "benar" - <i>meratakan teks ke kanan</i>.</li> </ul><h2>Penjajaran | Indentasi teks HTML</h2> <p><b>Teks HTML dan lekukannya di sebelah kiri halaman</b></p> <p>Kami akan memproduksi <b>teks indentasi</b> di sebelah kiri dengan dua cara:</p> <p>Hasil:</p> <p><img src='https://i0.wp.com/ab-w.net/images/501pr.png' width="100%" loading=lazy></p> <p>Lihat di jendela baru.</p> <p>Halo para pembaca yang budiman dari situs blog. Hari ini kita terus belajar dan selanjutnya kita pada gilirannya memiliki properti text-decoration, vertical-align, text-align, text-indent dan beberapa lainnya, yang membantu untuk mendesain tampilan teks dalam kode Html.</p><p>Di artikel terakhir, kami melihat properti yang dimaksudkan untuk menyesuaikan tampilan font saat.</p><p>Yah, dan bahkan sebelumnya, kami memeriksa semua jenis secara mendetail, mempelajari bagaimana mereka dapat dikelompokkan dan prioritas apa yang ditetapkan browser saat menafsirkannya. Benar, semua ini dibagi menjadi beberapa artikel, jadi agar tidak bingung, saya menyarankan Anda untuk mempelajari materi sesuai urutan yang diberikan.</p><h2>Dekorasi teks, perataan teks, indentasi teks di CSS</h2><p>Bagaimana cara bekerja dengan teks di Css? Sangat logis untuk mengasumsikan bahwa ada aturan yang dirancang khusus untuk tujuan ini. Mari kita mulai dengan text-align, yang sebenarnya merupakan pengganti atribut align (ini digunakan untuk menyelaraskan konten seperti paragraf atau heading P).</p><p>Ini hanya memiliki empat kemungkinan arti:</p><p>Artinya tetap sama seperti sebelumnya. <b>Perataan teks</b> Adalah perataan garis horizontal. Aturan ini hanya berlaku untuk elemen blok (paragraf, tajuk, dll.), Mis. tag tersebut di mana beberapa baris mungkin muncul. Karena Karena hanya ada satu baris elemen sebaris, tidak ada gunanya menggunakan perataan teks di dalamnya.</p><p>Jelas bahwa nilai-nilai aturan ini berarti kesejajaran, masing-masing: ke kiri (kiri), ke kanan (kanan), ke tengah (tengah) dan dengan lebar halaman (Ratakan - serentak ke kiri dan kanan dengan meningkatkan jarak antar kata) ... Tak perlu dikatakan bahwa nilai Justify harus digunakan untuk elemen dengan setidaknya beberapa baris teks, jika tidak maka tidak akan ada efek yang terlihat dari ini.</p><p>Misalnya, saya membenarkan lebar paragraf sebelumnya (Anda dapat melihatnya bahkan memiliki batas di kiri dan kanan) menggunakan:</p><p>Text-align: justify;</p><p>Secara default, teks diratakan secara horizontal ke kiri, mis. Anda tidak perlu menulis text-align: left secara khusus, kecuali, tentu saja, Anda sebelumnya telah menentukan perataan yang berbeda. Ngomong-ngomong, saya menyejajarkan paragraf ini di tengah (tengah) lagi untuk contoh ilustrasi, tapi di sini, menurut saya, semuanya jelas.</p><p>Aturan css berikutnya <b>teks-indentasi</b> memungkinkan Anda menyetel garis merah, misalnya, untuk teks dalam tag paragraf P.</p><p><img src='https://i1.wp.com/ktonanovenkogo.ru/image/text-indent.png' height="66" width="282" loading=lazy></p><p>Berapa persentase yang dihitung dari dalam teks-indentasi? Dari lebar area yang disisihkan untuk teks. Itu. Indentasi teks aturan css: 50% akan menyetel garis merah sama dengan setengah panjang baris yang sama ini. Nah, paragraf ini hanyalah contoh dari aturan semacam itu.</p><p>Atau Anda dapat, misalnya, menetapkan nilai negatif untuk garis merah di indentasi teks, dan kemudian kita akan mendapatkan sesuatu seperti yang Anda lihat di paragraf ini. Untuk mencapai ini, saya menulis aturan CSS berikut untuk tag paragraf P:</p><p>Indentasi teks: -1em;</p><p>Nah, penggunaan text-indent yang umum (untuk mengatur garis merah standar) mungkin terlihat seperti ini: text-indent: 40px; (diterapkan pada paragraf ini). Aturan ini, seperti perataan teks yang dibahas sebelumnya, <b>hanya berlaku untuk elemen blok</b>, yaitu di mana beberapa baris mungkin muncul (paragraf, judul, dll.).</p><p>Jadi sekarang mari kita lanjutkan ke <b>dekorasi teks</b> (desain menggunakan garis horizontal), yang sudah diterapkan ke semua elemen Html (baik sebaris maupun blok).</p><p>Itu hanya bisa memiliki empat arti:</p><p>Itu. dapat digunakan dengan dekorasi teks: overline, line-through atau underline, well, atau gunakan tidak sama sekali. Beberapa elemen Html sudah memiliki garis horizontal secara default, misalnya (secara default digarisbawahi).</p><p>Oleh karena itu, menyoroti sesuatu yang lain dengan garis bawah (kecuali untuk hyperlink) tidak baik, karena di alam bawah sadar pengguna tertulis bahwa setelah digarisbawahi (dan juga disorot dalam warna), itu berarti Anda dapat mengklik ini untuk pergi. Tetapi dengan menyorot teks biasa dengan garis bawah, Anda menyesatkan pengguna dan kekecewaan berikutnya dengan sumber daya Anda (pikirnya, tapi ternyata ...).</p><p>Nuansa dalam menggunakan aturan dekorasi teks Css adalah Anda dapat menulis tiga (atau dua) nilai sekaligus untuk setiap elemen Html (tanpa menghilangkan) dan sebagai hasilnya Anda mendapatkan <span>fragmen teks coretan yang digarisbawahi</span> (terdengar keren dan terlihat, bukan?):</p><p>Teks-dekorasi: garis bawah garis melalui;</p><p>Nilai untuk dekorasi teks (jika Anda ingin menggunakan beberapa di antaranya sekaligus) harus ditulis <b>dipisahkan oleh karakter spasi</b>.</p><h2>Perataan vertikal - perataan vertikal</h2><p>Selanjutnya kita memiliki perataan vertikal - perataan vertikal. Untuk hampir semua elemen dalam kode Html, ini berarti penyelarasan elemen sebaris dengan teks relatif terhadap garis dasarnya. Benar, untuk ini artinya sedikit berbeda - semua konten yang ada di sel ini akan disejajarkan secara vertikal.</p><p>Untuk Css, aturan perataan vertikal dapat menggunakan nilai berikut:</p><p>Baris diratakan ke garis dasar secara default. Lihat, saya melamar <span>ke bagian teks ini menambah font</span> dan kedua bagian ini sejajar dengan garis alas (bawah). Dan perataan vertikal dengan perataan vertikal secara tepat dimaksudkan untuk mengubah cara perataan garis.</p><p>Misalnya, jika saya menulis perataan vertikal: garis dasar untuk bagian teks yang sama diperbesar, maka tidak akan terjadi perubahan, karena nilai dasar digunakan untuk aturan css default ini.</p><p>Ngomong-ngomong, angka dapat digunakan sebagai nilai untuk itu, dan tulisan vertical-align: 0 akan berarti sama dengan vertical-align: baseline, yaitu. nilai dasar sama dengan nol. Oleh karena itu, jika kita ingin menunjukkan pergeseran dalam perataan vertikal, maka pergeseran ini akan ditunjukkan relatif terhadap garis dasar (atau nol).</p><p>Anda bisa menulis seperti ini:</p><p>Perataan vertikal: 10px;</p><p>Dan kami mendapatkan <span>menggeser fragmen dengan font yang diperbesar ke atas</span> 10 piksel dari garis dasar. Jika kita menulis nilai negatif:</p><p>Perataan vertikal: -10px;</p><p>Kita mendapatkan <span>memindahkan fragmen ke bawah</span> relatif terhadap baseline. Contoh tersebut menunjukkan bahwa karena adanya pergeseran, tinggi garis telah bertambah sehingga teks pas di dalamnya tanpa menabrak garis yang berdekatan. Pergeseran juga bisa diatur di Em dan Ex, yah, dan sebagai persentase, yang akan dihitung dari tinggi garis elemen ini (ingat di artikel terakhir kita belajar cara mengaturnya menggunakan).</p><p>Untuk meratakan konten sel tabel secara vertikal, Anda harus menggunakan nilai Atas dan Bawah untuk membuat konten sejajar dengan bagian atas dan bawah sel, masing-masing (yah, tengah dalam sel tabel digunakan sebagai nilai perataan vertikal default).</p><p>Dan untuk elemen font, Anda bisa menggunakan text-top, text-bottom, middle. Mari terapkan misalnya ke <span>bagian teks ini</span> nilai:</p><p>Perataan vertikal: tengah;</p><p>Apa yang terjadi sebagai hasilnya? Garis tengah dari fragmen yang diperbesar sejajar dengan garis dasar teks normal, mis. kami mendapat perataan garis tengah vertikal. Untuk text-top dan text-bottom, semuanya akan sama. Ini text-top, dan text-bottom.</p><p>Nilai Css dari sub-align vertikal dan properti super sesuai dengan sub- dan superscript, yang berlangsung dalam Html murni (sebelum menggunakan properti CSS untuk desain visual).</p><h2>Transformasi teks, spasi huruf, spasi kata, dan spasi kosong</h2><p>Tidak ada digunakan secara default dan berarti bahwa karakter dalam teks tidak akan berubah dengan cara apa pun - seperti yang ditulis dalam Html, karakter tersebut akan ditampilkan. Nilai huruf besar untuk text-transform akan mengubah semua huruf dalam fragmen menjadi huruf besar ( <span>contoh ditunjukkan dalam kalimat ini</span>dimana aturan text-transform: huruf besar digunakan dan huruf aslinya ditulis dalam huruf kecil).</p><p>Nilai huruf kecil untuk aturan transformasi teks Css akan memungkinkan Anda untuk mengubah semua karakter dalam fragmen menjadi huruf kecil, nah, dan nilai kapital akan membuat semua huruf pertama dari kata menjadi huruf besar ( <span>contoh dalam kalimat ini</span> - text-transform: capitalize). Itu. menggunakan transformasi teks, Anda dapat melakukan apa saja dengan teks biasa, dan kemudian mengembalikan semuanya dengan mudah.</p><p>Oleh karena itu, jika, misalnya, Anda memiliki tugas untuk membuat semua judul hanya ditulis dengan huruf kapital, maka dalam Html tuliskan biasanya, dan buat dengan huruf besar dalam CSS menggunakan text-transform: uppercase. Kemudian, jika Anda memutuskan untuk mengubah sesuatu kembali, maka cukup membuat perubahan kecil saja pada gayanya, dan bukan pada konten dari semua 100.500 judul di situs Anda.</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/letter-spacing.png' height="91" width="358" loading=lazy></p><p>Secara default, spasi huruf dan spasi kata diatur ke Normal, atau ini sama dengan nol (yaitu jarak antara karakter dan kata tidak berubah dengan cara apa pun). Besarnya perubahan jarak dalam aturan ini hanya dapat ditentukan dalam piksel, baik Em atau Ex, tetapi tidak dalam persen.</p><p>Namun, Anda dapat menggunakan nilai positif (ketersebaran karakter atau kata) dan nilai negatif (konvergensi karakter atau kata). Misalnya, Anda bisa <span>"Seperti ini untuk menyederhanakan karakter dalam frasa ini"</span> menggunakan aturan Css berikut:</p><p>Penspasian huruf: 0.4em;</p><p>Atau kamu bisa <span>"Seperti ini untuk menyatukan karakter dalam frasa ini"</span> melalui:</p><p>Penspasian huruf: -1px;</p><p>Hal yang sama dapat dikatakan tentang spasi kata dengan satu-satunya perbedaan bahwa jarak akan berubah antar kata, <span>seperti, misalnya, dalam frasa ini, menggunakan konstruksi CSS ini</span>:</p><p>Spasi kata: 4em;</p><p>Demikian pula, nilai negatif dapat digunakan dalam penspasian kata untuk mengurangi jarak antar kata.</p><p>Nah, dan aturan Css terakhir untuk hari ini, yang memungkinkan Anda untuk mengatur gaya teks dengan cara tertentu dalam kode Html, adalah <b>ruang putih</b>... Ini bertanggung jawab untuk menampilkan karakter spasi putih pada halaman web, yang terjadi saat menulis kode Html.</p><p>Seperti yang Anda ingat dari artikel tentang, browser, saat mengurai kode, menggabungkan semua spasi, jeda baris, dan tab ke dalam satu spasi, dan menjalankan jeda baris pada halaman web persis dengan spasi yang terjadi di kode.</p><p>Jadi, spasi putih dapat mengambil salah satu dari tiga nilai:</p><p><img src='https://i2.wp.com/ktonanovenkogo.ru/image/white-space.png' width="100%" loading=lazy></p><p>Jelas bahwa nilai default adalah Normal, dan dalam hal ini semuanya ditampilkan seperti yang saya jelaskan di atas. Tetapi saat menggunakan nilai Pre, kami mendapatkan analogi lengkap dengan menggunakan, yaitu pada halaman web, teks akan ditampilkan dengan semua karakter spasi ekstra yang terjadi saat menulis kode, dan browser tidak akan dapat melakukan transfer padanya.</p><p>Nah, dan artinya <b>nowrap</b> hanya akan mencegah browser membungkus whitespace yang ditemukannya di dalam potongan CSS spasi: nowrap. Anda juga dapat mencoba cara kerjanya dengan membuat file Html sederhana dan melampirkan bagian teks apa pun dalam tag tersebut:</p><p> <div style="white-space:pre;">fragmen teks uji</div> </p><p>Semoga berhasil! Sampai jumpa di halaman situs blog</p><h3></h3><p>Anda mungkin tertarik</p><p><img src='https://i2.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/list-style.jpg' width="100%" loading=lazy><span>Gaya daftar (jenis, gambar, posisi) - Aturan css untuk menyesuaikan tampilan daftar dalam kode Html</span> <br><img src='https://i1.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/z-index-cursor.jpg' width="100%" loading=lazy><span>Memposisikan dengan Z-index dan aturan Kursor CSS untuk mengubah kursor mouse</span> <br><img src='https://i1.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/padding-margin-border.jpg' width="100%" loading=lazy><span>Padding, Margin dan Border - kami menetapkan margin internal dan eksternal di CSS, serta batas untuk semua sisi (atas, bawah, kiri, kanan)</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/uroki-css.jpg' width="100%" loading=lazy><span>Untuk apa CSS itu, bagaimana menghubungkan cascading style sheets ke dokumen Html dan dasar-dasar sintaks bahasa ini</span> <br><img src='https://i2.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/float-clear.jpg' width="100%" loading=lazy><span>Float dan clear di CSS - blok alat tata letak</span> <br><img src='https://i2.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/css.jpg' width="100%" loading=lazy><span>CSS - apa itu, bagaimana cascading style sheets ditautkan ke kode html menggunakan Style dan Link</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/razmery-nasledovanie-css.jpg' width="100%" loading=lazy><span>Satuan Dimensi (Piksel, Em dan Ex) dan Warisan Aturan CSS</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/css-selektory.jpg' width="100%" loading=lazy><span>Pemilih untuk tag, kelas (kelas), Id dan generik, serta pemilih atribut di CSS modern</span> <br><img src='https://i1.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/position-css.jpg' width="100%" loading=lazy><span>Posisi (absolut, relatif dan tetap) - cara memposisikan elemen Html di CSS (aturan kiri, kanan, atas dan bawah)</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/background-color.jpg' width="100%" loading=lazy><span>Latar belakang dalam CSS (warna, posisi, gambar, ulangi, lampiran) - semua untuk mengatur warna latar belakang atau gambar latar belakang elemen Html</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> <div class="dsperelink"> <div class="read-analog"> <style> </style> <style> #perelink-horizontal { vertical-align: top; margin: 0 -5px; text-align: left; } #perelink-horizontal .perelink-horizontal-item { vertical-align: top; display: inline-block; width: 192px; margin: 0 5px 10px; } #perelink-horizontal .perelink-horizontal-item a span { display: block; margin-top: 10px; } #perelink-horizontal img { width: 192px; height: 192px; margin-bottom: 10px; } </style> <div id="perelink-horizontal"> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/id/spektroskop-iz-difrakcionnoi-reshetki-svoimi-rukami-kak.html"> <img src="/uploads/d852d2bcc1c1ba93bf5fd82d12628c28.jpg" height="192" width="192" loading=lazy> <span>Bagaimana cara membuat spektrometer dari ponsel?</span> </a> </div> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/id/kak-polzovatsya-shtatnoi-magnitoloi-na-reno-daster-esli-ne.html"> <img src="/uploads/ea18d0ad8b90ee94df7a5828ccc1c6e6.jpg" height="192" width="192" loading=lazy> <span>Jika radio Renault Duster tidak berfungsi</span> </a> </div> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/id/rc-cepi-naznachenie-i-princip-raboty-integriruyushchaya-cep-rezistivno-emkostnye.html"> <img src="/uploads/4fae6d693e2aa982fbac209f316fec07.jpg" height="192" width="192" loading=lazy> <span>Tujuan rangkaian Rc dan prinsip kerja</span> </a> </div> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/id/proshivka-marlin-dlya-3d-na-russkom-kalibrovka-stola-vybiraem.html"> <img src="/uploads/9bc06a193ff3f0cdf987a0426ff5e402.jpg" height="192" width="192" loading=lazy> <span>Firmware Marlin untuk 3D dalam bahasa Rusia</span> </a> </div> </div> </div> </div> </div> </article> </div> </section> <aside class="col-xs-12 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation"> <div class="mainnavbar side-box clear"> <div id="nav_menu-2" class="side-box_b"> <div class="menu-sidenav-container"> <ul id="menu-sidenav" class="menu"> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/total/">Umum</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/hard-drive/">HDD</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/different/">bermacam-macam</a> </li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/windows/">Windows</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/apple/">apel</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/android/">Android</a> </li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/browsers/">Browser</a> </li> </ul> </div> </div> </div> <div class="side-box lastfaq faqli clear"> <span class="title-f">TOP 5:</span> <ul class="textw_a clear"> <li><a href="https://olympsb.ru/id/kak-otsoedinit-tachskrin-ot-ekrana-kak-snyat-razbityi.html">Cara menghapus layar sentuh yang rusak dari ponsel Anda</a></li> <li><a href="https://olympsb.ru/id/intellektualnoe-zaryadnoe-ustroistvo-dlya-litievyh-akkumulyatorov.html">Baterai lithium-ion: cara mengisi daya dengan benar</a></li> <li><a href="https://olympsb.ru/id/mozhno-li-na-nokia-lyumiya-520-informaciya-o-tehnologiyah-navigacii-i.html">Informasi tentang teknologi navigasi dan pemosisian yang didukung oleh perangkat</a></li> <li><a href="https://olympsb.ru/id/universalnyi-pult-dlya-bytovoi-tehniki-pulty-universalnye.html">Remote control universal untuk peralatan rumah tangga</a></li> <li><a href="https://olympsb.ru/id/nastroika-debian-na-orange-pi-zero-ustanovka-os-linux-na-orange-pi-sborki-ot-loboris.html">Menginstal OS Linux di Orange Pi</a></li> </ul> </div> <div class="side-box lastfaq faqli clear"> <span class="title-f">Materi terbaru:</span> <ul> <li> <a href="https://olympsb.ru/id/elektronnye-vesy-pokazyvayut-oshibku-lo-napolnye-vesy-pokazyvayut-lo.html" >Timbangan lantai menunjukkan LO - apa artinya dan cara memperbaikinya</a> </li> <li> <a href="https://olympsb.ru/id/svetilnik-s-upravlyaemoi-yarkostyu-dimmirovanie-svetodiodov-v-obshchem-i-v.html" >Peredupan LED secara umum dan detail</a> </li> <li> <a href="https://olympsb.ru/id/kak-otlichit-original-xiaomi-mi-power-bank-ot-poddelki-torec-s-knopkami.html" >Akhiri dengan tombol, indikator dan USB</a> </li> <li> <a href="https://olympsb.ru/id/kak-proverit-xiaomi-power-bank-na-originalnost-i-otlichit-ego-ot.html" >Pengisian aliran</a> </li> <li> <a href="https://olympsb.ru/id/xiaomi-yi-action-camera-proshivka-kak-obnovit-proshivku-xiaomi-yi-action-camera-do.html" >Cara Update Firmware Xiaomi Yi Action Camera ke Versi Terbaru</a> </li> </ul> </div> <div class="side-box clear"> <div id="rexuta2" style="height:800px;width:240px;" align="center"></div> </div> </aside> </section> <div class="footer"> <div id="footer_mainnav" class="mainnav collapse navbar-collapse col-xs-12 col-sm-12"> <ul id="menu-mainnav-1" class="nav navbar-nav navi"> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/flash-drives/">Flash drive</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/total/">Umum</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/hard-drive/">HDD</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/different/">bermacam-macam</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/id/category/windows/">Windows</a></li> </ul> </div> <div class="twobl-footer col-xs-12 col-sm-12"> <div class="onef col-xs-12 col-sm-3"> <div class="fool2og log-m_h1"> <img src='/public/logo.png' loading=lazy> </div> <div class="decksite"></div> </div> <div class="twof col-xs-12 col-sm-2"> <ul id="menu-foonav" class="twonavig"> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/id/category/apple/">apel</a></li> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/id/category/android/">Android</a></li> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/id/category/browsers/">Browser</a></li> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/id/category/flash-drives/">Flash drive</a></li> </ul> </div> <div class="treef col-xs-12 col-sm-4"> <ul class="f-post"> <li><a href="https://olympsb.ru/id/upravlenie-zvukom-s-garnitury-android-remont-kompyuternoi.html">Perbaikan headset komputer (headphone) do-it-yourself Sesuaikan volume di headphone</a></li> <li><a href="https://olympsb.ru/id/fonar-fenix-sd11-cree-xm-l2-u2-nalobnyi-fonar-fenix-hl60r-cree-xm-l2-u2-neutral-white-led-podrobnee.html">Lampu Depan Fenix \u200b\u200bHL60R Cree XM-L2 U2 LED Putih Netral Selengkapnya tentang reflektor, utas, dll.</a></li> <li><a href="https://olympsb.ru/id/samodelnye-pribory-dlya-proverki-ers-rlc-i-esr-metr-ili-pribor-dlya-izmereniya.html">RLC dan ESR meter, atau alat untuk mengukur kapasitor, induktor dan resistor resistansi rendah</a></li> <li><a href="https://olympsb.ru/id/samodelnyi-izmeritel-esr-rlc-i-esr-metr-ili-pribor-dlya-izmereniya-kondensatorov.html">RLC dan ESR meter, atau alat untuk mengukur kapasitor, induktor dan resistor resistansi rendah</a></li> </ul> </div> <div class="fourf col-xs-12 col-sm-3"> <div class="buth"> <a class="butt-faq buttorang" href="" title="kontak">Kontak</a> </div> <p class="continfo">Bantuan komputer Olympus</div> </div> <div class="tree-footer col-xs-12 col-sm-12 clear"> © 2021. olympsb.ru. Bantuan komputer Olympus.</div> </div> <script src="https://olympsb.ru/wp-content/themes/vsepropechen/js/bootstrap.min.js"></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.5.1'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/wp-postratings/postratings-js.js?ver=1.83'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.7.6'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/disqus-comment-system/media/js/disqus.js?ver=4.7.6'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/disqus-comment-system/media/js/count.js?ver=4.7.6'></script> <div style="display:none"> <div id="text-3" class="conter-metr"> <div class="textwidget"> </script> </div> </div> </div> <div id="top-link"> <a href="https://olympsb.ru/id/#top"></a> </div> <script type="text/javascript">  </script><br> <br> </body> </html> </div>