CSS penataan placeholder. Tampilan nama bidang atau cara mengubah placeholder. Menyembunyikan placeholder dengan baik

Dalam upaya untuk mengurangi bentuk dan mengurangi kebisingan visual, desainer tag digantikan oleh atribut placeholder, sehingga meningkatkan beban pada memori jangka pendek. Bagi penyandang tunanetra, petunjuknya sulit dibaca. Tempat yang lebih baik tepat di atas kolom input. Bidang kosong lebih mudah dikenali sebagai elemen yang perlu diisi.

Dengan buruk

Bagus

Styling: ubah warna CSS placeholder

Ubah gaya bidang input dengan CSS placeholder

Dengan buruk

efek placeholder untuk

Atribut placeholder hanya berfungsi untuk dan , bahkan jika tag lain memiliki set atribut contenteditable.</p> <style> .raz { height: 3em; border: 1px solid; } </style> <div contentEditable placeholder="Anda dapat memasukkan teks" class="raz"></div> <style> .raz { height: 3em; border: 1px solid; } .raz:empty:not(:focus)::before { <i>/* хак: если div задать и placeholder , то и.raz:empty:not(:placeholder-shown)::before будет работать */ </i> content: attr(data-placeholder); opacity: .5; } </style> <div contentEditable data-placeholder="Anda dapat memasukkan teks" class="raz"></div> <h2>Metode memori kuno yang mengubah nilai JavaScript</h2> <input onblur="this.value=(this.value=="fokus ="this.value=(this.value==this.title)?" value="Surel" title="Surel"> <input onblur="this.value=(this.value=="")?this.title:this.value;" onfocus="this.value=(this.value==this.title)?"":this.value;" value="Surel" title="Surel" /> <p>Hai, hari ini menggunakan placeholder untuk input bukanlah hal yang mengejutkan. Placeholder adalah teks sementara dengan contoh di dalam input yang hilang saat teks dimasukkan. Gaya CSS untuk placeholder, kami akan mencoba mendaftar hari ini.</p> <h2>Tugas: buat gaya css Anda sendiri untuk placeholder</h2> <p>Katakanlah kita memiliki situs bergaya yang menggunakan placeholder di input. Kita perlu membuat gaya teks abu-abu menjemukan placeholder terlihat dalam gaya umum situs. Bagaimana ini bisa dicapai? Saya harus segera mengatakan bahwa ini belum berfungsi di semua browser. Secara khusus, di IE versi 9 dan di bawahnya tidak berfungsi sama sekali, di IE 10 dan selanjutnya masih berfungsi dengan susah payah. Firefox dan browser webkit adalah masalah lain.</p> <h2>Solusi: gaya css untuk placeholder</h2> <p>Jadi, kami telah menetapkan tugas, bagaimana kami akan menyelesaikannya?</p> <p>Pertama, mari kita buat situs pengujian:</p><p> <input type="text" name="input" placeholder="Teks placeholder kami" value="" /> </p><p>Selesai, sekarang mari kita lihat apa yang dapat dilakukan dengan gaya: webkit dan mozilla memiliki pengubah sendiri yang memungkinkan Anda untuk menetapkan gaya khusus ke placeholder: ::-webkit-input-placeholder dan :-moz-placeholder. Mari kita lihat cara menggunakannya:</p> <p>Mari kita jelaskan gaya input itu sendiri dan teks di dalamnya (contoh warna biru untuk kontras):</p><p>Input (lebar: 250px; warna: biru; berat font: normal; gaya font: normal; )</p><p>Sekarang kita akan menulis gaya khusus untuk teks placeholder di input ini untuk browser Webkit (Chrome, Safari, Opera):</p><p>Input::-webkit-input-placeholder( color: red; font-style: italic; font-weight: bold; )</p><p>Mari kita buat teks placeholder menjadi merah <a href="https://venikdaily.ru/id/m-video/html-vydelenie-vydelenie-teksta-zhirnym-kursivom-i-cvetom-kak-sdelat-v/">tebal miring</a>. Perhatikan bahwa tidak seperti kelas semu CSS lainnya yang dipisahkan oleh titik dua tunggal, gaya untuk placeholder di webkit dipisahkan oleh titik dua ganda.</p> <p>Sekarang mari kita menulis gaya yang persis sama untuk <a href="https://venikdaily.ru/id/yota/rezhim-inkognito-v-firefox-bezopasnyi-prosmotr-stranic-i-anonimnyi/">Mozilla Firefox</a> browser:</p><p>Input:-moz-placeholder( color: red; font-style: italic; font-weight: bold; )</p><p>Siap. Gaya CSS untuk placeholder, tentu saja Anda dapat meresepkan salah satu yang lebih cocok untuk desain Anda. Demo kerja dapat dilihat di</p> <p>Elemen semu yang mengatur gaya teks perintah yang dibuat oleh atribut placeholder. Anda dapat menggunakan properti untuk mengubah tampilan teks, misalnya, mengatur font dan warna.</p><h2>Sintaksis <i> </i></h2><p><i>pemilih</i>::tempat penampung ( ... )</p><active.sync><h2>Notasi</h2><table><tbody><tr><th> </th><th>Keterangan</th><th style="width: 130px">Contoh</th> </tr><tr><td><тип> </td><td>Menentukan jenis nilai.</td><td><размер> </td> </tr><tr><td>A&&B</td><td>Nilai harus dikeluarkan dalam urutan yang ditentukan.</td><td><размер> && <цвет> </td> </tr><tr><td>Sebuah | B</td><td>Menunjukkan bahwa hanya satu dari nilai yang disarankan (A atau B) yang harus dipilih.</td><td>biasa | topi kecil</td> </tr><tr><td>Sebuah || B</td><td>Setiap nilai dapat digunakan sendiri atau dalam kombinasi dengan nilai lain dalam urutan apa pun.</td><td>lebar || menghitung</td> </tr><tr><td> </td><td>Nilai grup.</td><td>[ potong || 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>Contoh</h2><p><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>tempat penampung</title> <style> body { background: #053f38; } input { border: 1px solid #98baba; /* Параметры рамки */ background: transparent; /* <a href="https://venikdaily.ru/id/megaphone/kak-delat-prozrachnye-zamenit-belyi-ili-odnotonnyi-fon-na/">Прозрачный фон</a> */ padding: 1px 4px; /* Поля вокруг текста */ color: #fff; /* Цвет текста */ } input::-moz-placeholder { color: #ffd595; /* Цвет подсказывающего текста */ } input::-webkit-input-placeholder { color: #ffd595; } input:-ms-input-placeholder { color: #ffd595; } input::-ms-input-placeholder { color: #ffd595; } input::placeholder { color: #ffd595; } </style> </head> <body> <form action="handler.php"> <p><input type="search" placeholder="Mencari situs" name="q"> <input type="submit" value="Menemukan"></p> </form> </body> </html> </p><p>Hasil dari contoh ditunjukkan pada Gambar. satu.</p><p>Beras. 1. Penggunaan:: placeholder</p><h2>Catatan</h2><p>Internet Explorer menggunakan kelas semu :-ms-input-placeholder.</p><p>Microsoft Edge menggunakan elemen semu ::-ms-input-placeholder.</p><p>Chrome sebelum versi 57, Opera sebelum versi 44, Safari sebelum versi 10.1, dan Android menggunakan elemen semu ::-webkit-input-placeholder.</p><p>Firefox dari versi 4 hingga 19 menggunakan pseudo-class :-moz-placeholder .</p><p>Firefox sebelum versi 51 menggunakan elemen semu ::-moz-placeholder.</p><h2>Browser <i> </i></h2><p><b-tabs type="is-boxed"><b-tab-item label="Настольные" icon="icon-desktop" icon-pack="icon"></b-tab-item></b-tabs></p><active.sync><h2>Browser</h2><p>Notasi berikut digunakan dalam tabel browser.</p></active.sync></active.sync> <br><p> <br>Banyak dari Anda sering menemukan formulir yang memiliki tanda tangan sebagai petunjuk. Mereka menghilang saat mengetik. Jadi - ini adalah atribut placeholder, yaitu untuk elemen yang dibuat untuk input teks (input). Dengan itu, Anda dapat mengatur teks yang akan ditampilkan sebagai petunjuk sebelum masuk ke bidang ini. Sayangnya, tidak semua browser bekerja sama baiknya dengan atribut ini. Versi usang dan semuanya <a href="https://venikdaily.ru/id/ios/prezentaciya-po-informatike-bazy-dannyh-sistemy-upravleniya/">teks yang diberikan</a> tidak menampilkan.</p><p>Sekarang mari kita lihat bagaimana melakukannya untuk menyelesaikan masalah yang dijelaskan di bawah ini:</p><p>1. Bagaimana mengubah gaya untuk placeholder; <br>2. Cara menyembunyikan teks placeholder bukan saat masuk, tetapi sudah saat mengklik bidang; <br>3. Apa yang harus dilakukan dengan browser di mana, pada prinsipnya, placeholder tidak ditampilkan.</p><p>Dalam semua contoh, kami akan bekerja dengan bidang input.</p><h2>Bagaimana cara mengubah warna teks petunjuk di placeholder di input?</h2>Bukan lagi berita bahwa setiap browser tidak hanya menampilkan placeholder secara berbeda, tetapi juga membutuhkan properti khusus untuk mengubah gaya. Dan saya tidak berbicara tentang awalan yang sesuai secara tertulis. Mari kita lihat mereka. <p>Warna tooltip abu-abu secara default di banyak browser. PADA <a href="https://venikdaily.ru/id/yota/skachat-prezentaciyu-paskal-prezentaciya-osnovy-pascal-tipy-dannyh-primery/">contoh ini</a> mari kita membuatnya hitam.</p><p> <style><br> ::-webkit-input-placeholder {color:#000000; opacity:1;}/* webkit */<br> ::-moz-placeholder {color:#000000; opacity:1;}/* Firefox 19+ */<br> :-moz-placeholder {color:#000000; opacity:1;}/* Firefox 18- */<br> :-ms-input-placeholder {color:#000000; opacity:1;}/* IE */<br> </style></p><p> <input type="text" placeholder="Mulai mengetik" value="" /> </p><p>Properti opacity, yang bertanggung jawab atas transparansi, harus dimasukkan untuk browser yang mendukung transparansi untuk elemen ini. Jika tidak, warnanya akan menjadi abu-abu, seperti defaultnya.</p><p>Dan ya, Anda dapat menggunakan kelas untuk menentukan properti ini. Lihat di bawah:</p><p>Input-phone::-webkit-input-placeholder ( color:red; ) <br>.input-text::-webkit-input-placeholder ( color:green; ) <br>/* dan seterusnya... */</p><h2>Hapus placeholder saat mengklik bidang</h2>Secara default, di browser, teks dari atribut placeholder menghilang hanya setelah input dimulai, tetapi ada orang yang ingin teks ini tidak mengganggu pada tahap mengklik bidang input. Paling sering mereka melakukan hal itu. Untuk melakukan ini, Anda perlu menulis gaya untuk fokus, di mana warna teks petunjuk menjadi benar-benar transparan, yaitu, tidak akan terlihat lagi. <p>:fokus::-webkit-input-placeholder (opacity:0;)/* webkit */ <br>:focus::-moz-placeholder (opacity:0;)/* Firefox 19+ */ <br>:focus:-moz-placeholder (opacity:0;)/* Firefox 18- */ <br>:fokus:-ms-input-placeholder (opacity:0;)/* IE */</p><p>Anda bahkan dapat mengatur perubahan halus dalam transparansi atau perubahan warna dengan animasi CSS. Tetapi mungkin ada masalah dengan kompatibilitas lintas-browser dari solusi tersebut.</p><h2>Tetapi bagaimana dengan browser yang tidak mendukung atribut placeholder pada input?</h2>Yah, pasti tidak tersesat) Ya, memang ada browser seperti itu. Misalnya, IE8. Dan ya, ada orang mahir yang akan selalu menggunakannya. Jika Anda perlu membuat solusi untuk semua pengunjung, maka bersabarlah sedikit. <p>Untuk mengatasi masalah ini, unduh plugin jquery populer untuk ini - jquery.placeholder. Saya tidak akan memberikan tautan, karena hari ini atau besok mereka akan berubah. Tetapi, jika ada, Anda dapat mengunduh contoh yang berfungsi dengan plugin di - unduh sumbernya.</p><p>Kami menghubungkannya. Jangan lupa bahwa Anda juga perlu menghubungkan jquery pada prinsipnya.</p><p> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script><br> <script src="/jquery.placeholder.min.js"></script></p><p> <script><br> $(function(){<br> $("input, textarea").placeholder();<br> });<br> </script></p><p> <style><br> input.placeholder, textarea.placeholder. { color: green; }<br> </style> </p> <p>Placeholder adalah kelas semu atau elemen semu yang bertanggung jawab untuk menampilkan nama bidang. Pada intinya, ini adalah tag (sebut saja untuk kesederhanaan) di mana Anda memasukkan kata, dan pengguna melihatnya di dalamnya. Beberapa jenis petunjuk atau nama untuk setiap bidang formulir.</p><p>Setiap browser menangani tag ini secara berbeda, dan gayanya menyisakan banyak hal yang diinginkan. Untuk mengubah gaya default, cukup tambahkan beberapa baris kode ke file gaya. Tidak ada yang sulit. <br>Kebenaran harus diingat bahwa tidak semua dari kita dapat berubah.</p><h2>Di antara berbagai gaya, dalam hal ini, hal-hal berikut tersedia untuk kami:</h2><ul><li>font-weight - mengatur bobot teks</li><li>ukuran font - pemilihan ukuran teks</li><li>font-family - pemilihan font</li><li>latar belakang — latar belakang dan gambar latar belakang</li><li>warna - warna teks</li><li>word-spacing - mengatur jarak antar kata</li><li>spasi huruf - mengatur jarak antar huruf</li><li>text-decoration - pilihan dekorasi kata. Digarisbawahi, dicoret, dll.</li><li>vertical-align - mengatur perataan vertikal</li><li>text-transform - pilihan untuk mengubah teks. Semua huruf kapital atau huruf kecil, dll.</li><li>line-height - jarak antar baris</li><li>text-indent - mengatur indentasi kiri dari baris pertama paragraf</li><li>text-overflow - pilihan untuk menampilkan teks yang tidak sesuai dengan blok (sembunyikan atau potong dan tambahkan elipsis)</li><li>opacity - pilih transparansi elemen</li> </ul><p>Sekarang kita telah menemukan gaya yang tersedia, kita dapat mulai mendekorasi, untuk ini kita akan menambahkan gaya berikut:</p><p>::-webkit-input-placeholder ( warna: #2cb04d; ) <br>::-moz-placeholder ( warna: #2cb04d; )/* Firefox 19+ */ <br>:-moz-placeholder ( warna: #2cb04d; ) /*Firefox 18- */ <br>:-ms-input-placeholder ( warna: #2cb04d; )</p><p>Setelah menambahkan baris ini, warna judul di dalam bidang formulir akan berubah dan di setiap browser akan sama. Di sini Anda dapat menambahkan gaya tambahan. <br>Misalnya, gaya ini</p><p>::-webkit-input-placeholder (warna: #2cb04d; ukuran font: 1.5em; berat font: 600;) <br>::-moz-placeholder (warna:#2cb04d; ukuran font:1.5em; berat font:600;) /*Firefox 19+*/ <br>:-moz-placeholder (warna:#2cb04d; ukuran font:1.5em; berat font:600;) /*Firefox 18-*/ <br>:-ms-input-placeholder (warna: #2cb04d; ukuran font: 1.5em; berat font: 600;)</p><p>Tambahkan warna, ukuran besar dan teks berat sedang. Jika Anda menambahkan properti tambahan <br>text-overflow:ellipsis maka teks akan dipotong agar sesuai dengan margin, dengan elipsis ditambahkan di akhir.</p><p>Ada properti lain yang menarik, berkat tampilan animasi di css (styles), Anda dapat mengatur persembunyian yang indah saat Anda meletakkan kursor di bidang. Sebelumnya, ini dilakukan melalui js (skrip)</p><p>Input::-webkit-input-placeholder (opacity: 1; transisi: opacity 0,3s kemudahan;) <br>.input::-moz-placeholder (opacity: 1; transisi: opacity 0.3s mudah;) <br>.input:-moz-placeholder (opacity: 1; transisi: opacity 0.3s mudah;) <br>.input:-ms-input-placeholder (opacity: 1; transisi: opacity 0.3s mudah;) <br>.input:focus::-webkit-input-placeholder (opacity: 0; transisi: opacity 0.3s mudah;) <br>.input:focus::-moz-placeholder (opacity: 0; transisi: opacity 0.3s mudah;) <br>.input:focus:-moz-placeholder (opacity: 0; transisi: opacity 0.3s mudah;) <br>.input:focus:-ms-input-placeholder (opacity: 0; transisi: opacity 0.3s mudah;)</p><p>Menambahkan gaya seperti itu akan membuat placeholder-a memudar ketika kursor ditempatkan di bidang <br>.input adalah kelas elemen bentuk. Agar gaya berfungsi, kode bidang formulir akan terlihat seperti ini:</p><p><input type="text" class="input" placeholder="nama bidang"></p><p>Atau Anda dapat menggunakan kelas elemen. Dengan demikian, Anda dapat mengatur gaya yang berbeda untuk setiap formulir.</p><p><!-- первым указываем класс контейнера, тег формы и тег вставки поля --><br>.input formulir formulir kontak::-webkit-input-placeholder (warna: #2cb04d; ukuran font: 1.5em; berat font: 600;) <br>.input formulir formulir kontak::-moz-placeholder (warna: #2cb04d; ukuran font: 1.5em; berat font: 600;)/*Firefox 19+*/ <br>.input formulir formulir kontak:-moz-placeholder (warna: #2cb04d; ukuran font: 1.5em; berat font: 600;)/*Firefox 18-*/ <br>.input formulir formulir kontak:-ms-input-placeholder (warna: #2cb04d; ukuran font: 1.5em; berat font: 600;)</p><p>Berikut adalah beberapa cara sederhana Anda dapat membuat desain formulir yang sangat indah.</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 loading=lazy>");</script> <div style="font-size:0px;height:0px;line-height:0px;margin:0;padding:0;clear:both"></div> </div> </div> <div class="related_block main_articles"> <h3 class="head2">Rekomendasikan artikel lain</h3> <div class="category_page related"> <div class="col-md-6 col-sm-6"> <div class="post"> <div class="thumb"> <a href="https://venikdaily.ru/id/m-video/slabotochnye-sistemy-chto-vhodit-chto-vklyuchayut-v-sebya-slabotochnye/"><img width="410" height="220" src="/uploads/82b836de95dd99bb3bfc72db5d380377.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="Apa yang termasuk pekerjaan tegangan rendah?" / loading=lazy loading=lazy></a> </div> <div class="cat_link"> <ul class="post-categories"> <li><a href="https://venikdaily.ru/id/category/m-video/" rel="category tag">Video M</a></li> </ul> </div> <div class="caption"> <div class="row"> <div class="col-md-12"> <h2><a href="https://venikdaily.ru/id/m-video/slabotochnye-sistemy-chto-vhodit-chto-vklyuchayut-v-sebya-slabotochnye/">Apa yang termasuk pekerjaan tegangan rendah?</a></h2> </div> </div> </div> </div> </div> <div class="col-md-6 col-sm-6"> <div class="post"> <div class="thumb"> <a href="https://venikdaily.ru/id/megafon-services/gde-hranit-dengi-na-otdyhe-v-otele-izuchaem-varianty-gde-hranit-dengi/"><img width="410" height="220" src="/uploads/955bc905d8623d6be6890fa2bae24546.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="Tempat menyimpan uang untuk liburan di hotel - menjelajahi opsi Tempat menyimpan barang di pantai" / loading=lazy loading=lazy></a> </div> <div class="cat_link"> <ul class="post-categories"> <li><a href="https://venikdaily.ru/id/category/megafon-services/" rel="category tag">Layanan Megafon</a></li> </ul> </div> <div class="caption"> <div class="row"> <div class="col-md-12"> <h2><a href="https://venikdaily.ru/id/megafon-services/gde-hranit-dengi-na-otdyhe-v-otele-izuchaem-varianty-gde-hranit-dengi/">Tempat menyimpan uang untuk liburan di hotel - menjelajahi opsi Tempat menyimpan barang di pantai</a></h2> </div> </div> </div> </div> </div> </div> </div> <dblock></dblock> </div> </div> </div> <div class="col-md-4 col-sm-4"> <aside class="right_col"> <div class="new_art box"> <h3>Paling populer</h3> <div class="post"> <div class="thumb"> <a href="https://venikdaily.ru/id/m-video/kak-prodat-kulinarnyi-recept-s-foto-zarabotok-v-internete-na-kulinarnyh/"><img width="410" height="220" src="/uploads/45a10970e92c87de9a6676d9bcf59494.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="Hasilkan uang secara online dari resep kuliner Jual resep tanpa foto" / loading=lazy loading=lazy></a> </div> <div class="cat_link"> <ul class="post-categories"> <li><a href="https://venikdaily.ru/id/category/m-video/" rel="category tag">Video M</a></li> </ul> </div> <div class="caption"> <div class="row"> <div class="col-md-12"> <h2><a href="https://venikdaily.ru/id/m-video/kak-prodat-kulinarnyi-recept-s-foto-zarabotok-v-internete-na-kulinarnyh/">Hasilkan uang secara online dari resep kuliner Jual resep tanpa foto</a></h2> </div> </div> </div> </div> <div class="post"> <div class="thumb"> <a href="https://venikdaily.ru/id/aliexpress/seld-pod-shuboi-brutto-netto-sbornik-receptov-sel-dka-pod-shuboi/"><img width="410" height="220" src="/uploads/7337906fea8ac0c22db641f8d181b5d0.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="Kumpulan resep* Herring di bawah mantel bulu" / loading=lazy loading=lazy></a> </div> <div class="cat_link"> <ul class="post-categories"> <li><a href="https://venikdaily.ru/id/category/aliexpress/" rel="category tag">Aliexpress</a></li> </ul> </div> <div class="caption"> <div class="row"> <div class="col-md-12"> <h2><a href="https://venikdaily.ru/id/aliexpress/seld-pod-shuboi-brutto-netto-sbornik-receptov-sel-dka-pod-shuboi/">Kumpulan resep* Herring di bawah mantel bulu</a></h2> </div> </div> </div> </div> <div class="post"> <div class="thumb"> <a href="https://venikdaily.ru/id/beeline/morkov-po-koreiski-s-pripravoi-tehnologicheskie-karty-prigotovleniya-blyud/"><img width="410" height="220" src="/uploads/4a9d9c1124dff616e4beea51cfb57781.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="Peta teknologi memasak Peta teknologi produk kuliner wortel Korea" / loading=lazy loading=lazy></a> </div> <div class="cat_link"> <ul class="post-categories"> <li><a href="https://venikdaily.ru/id/category/beeline/" rel="category tag">langsung menuju</a></li> </ul> </div> <div class="caption"> <div class="row"> <div class="col-md-12"> <h2><a href="https://venikdaily.ru/id/beeline/morkov-po-koreiski-s-pripravoi-tehnologicheskie-karty-prigotovleniya-blyud/">Peta teknologi memasak Peta teknologi produk kuliner wortel Korea</a></h2> </div> </div> </div> </div> </div> <aside id="text-2" class="widget widget_text"> <div class="textwidget"> <p> </p> </div> </aside> </aside> </div> </div> </div> </main> <footer id="footer"> <div class="container"> <div class="row"> <div class="col-md-4 col-sm-4"> <div class="logo_wr"> <a rel="sidebar" href="#" class="b_link">Ke bookmark</a> <a href="https://venikdaily.ru/id/" rel="home" class="logo2"><br></a> </div> <div class="f_text"> <p>© 2022. Panduan komunikasi seluler</p> <p>Seluruh hak cipta</p> <p>Setiap penggunaan materi yang diposting <br/>di situs hanya diperbolehkan dengan tertulis <br/>izin hak cipta</p> </div> </div> <div class="col-md-8 col-sm-8"> <div class="col-md-4 col-sm-4"> <nav class="footer_menu"> <div id="nav_menu-6"><div class="menu-header_menu-container"><dblock></dblock></div></div> </nav> </div> <div class="col-md-3 col-sm-3"> <dblock></dblock> </div> <div class="col-md-5 col-sm-5"> <div class="footer_right"> <a href="#" class="vk_link">Bergabunglah dengan Vkontakte</a> <div class="counter"> <dblock></dblock> </div> <div class="footer_menu3"> <div id="nav_menu-8"> <div class="menu-top_menu-container"> <ul id="menu-top_menu-1" class="menu"> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1361"><a href="" class="menu-image-title-after"><span class="menu-image-title">Pengiklan</span></a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item"><a href="https://venikdaily.ru/id/sitemap.xml" class="menu-image-title-after"><span class="menu-image-title">peta situs `</span></a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1363"><a href="" class="menu-image-title-after"><span class="menu-image-title">Edisi proyek</span></a></li> </ul> </div> </div> </div> <div class="soc"> <ul> <li class="item1"><a href="https://vk.com/share.php?url=https://venikdaily.ru/aliexpress/oformlenie-placeholder-css-vneshnii-vid-nazvaniya-polei-ili-kak-izmenit-placeholder/">vkontakte</a></li> <li class="item2"><a href="https://www.facebook.com/sharer/sharer.php?u=https://venikdaily.ru/aliexpress/oformlenie-placeholder-css-vneshnii-vid-nazvaniya-polei-ili-kak-izmenit-placeholder/">Facebook</a></li> <li class="item3"><a href="https://www.twitter.com/share?url=https%3A%2F%2Fvenikdaily.ru%2Fid%2Faliexpress%2Foformlenie-placeholder-css-vneshnii-vid-nazvaniya-polei-ili-kak-izmenit-placeholder%2F">Indonesia</a></li> <li class="item4"><a href="">google+</a></li> </ul> </div> </div> </div> </div> </div> </div> </footer> <script type='text/javascript'> /* <![CDATA[ */ var tocplus = { "visibility_show": "show", "visibility_hide": "hide", "width": "Auto" }; /* ]]> */ </script> <script type='text/javascript' src='/assets/front.min.js'></script> <script type='text/javascript'> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar": "right_col", "margin_top": 10, "margin_bottom": 0, "stop_id": "footer", "screen_max_width": 400, "screen_max_height": 0, "width_inherit": false, "refresh_interval": 1500, "window_load_hook": false, "disable_mo_api": false, "widgets": ['text-2'] }; </script> <script type='text/javascript' src='/assets/q2w3-fixed-widget.min.js'></script> <script type='text/javascript' src='/assets/wp-embed.min.js'></script> <script type='text/javascript' src='/assets/form.js'></script> <link href="https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700,700i" rel="stylesheet"> <script> var context = $('.new_articles'); while (context.children('div:not(.row)').length) { context.children('div:not(.row):lt(2)').wrapAll('<div class="row">'); } var context = $('.category_page'); while (context.children('div:not(.row)').length) { context.children('div:not(.row):lt(3)').wrapAll('<div class="row">'); } $(document).ready(function() { $(".mob_menu li.menu-item-has-children a:first-child").addClass('open_link'); $(".mob_menu li.menu-item-has-children ul a:first-child").removeClass('open_link'); $(".open_menu_link").click(function() { $(".mob_menu").slideToggle("fast"); return false; }); $(".mob_menu li.menu-item-has-children a.open_link").click(function() { $(this).next().slideToggle("fast"); return false; }); }); </script> </body> </html>