Membuat Garis Vertikal Di Html
Hallo teman-teman Dumet School. Kembali pula dengan saya Shelli Ripati di Kursus Web Design, panggung tutorial terbaik dan nomor suatu. Bisa jadi ini saya akan mengomongkan tentang mandu Menciptakan menjadikan Garis Vertical Sreg Menu Menggunakan Border. Sebelumnya saya akan menguraikan adapun fungsi berpunca border puas CSS. Border berfungsi buat membuat garis pinggir pada sebuah element atau objek.
Tanda property border bisa kita bedakan menjadi 5 macam, adalah:
- Border yang berfungsi bagi mengasihkan garis pinggir semua sisi
- Border-top yang berfungsi untuk menyerahkan garis pinggir plong bagian atas
- Border-bottom nan berfungsi untuk memberikan garis pinggir plong episode bawah
- Border-right yang berfungsi untuk mengasihkan garis pinggir pada penggalan kanan
- Border-left yang berfungsi untuk memberikan garis pinggir sreg adegan kiri
Nah, persiapan pertama lakukan Membuat Garis Vertical Pada Menu Menggunakan Border adalah kita cak bagi struktur htmlya bahkan dulu. Sama dengan pada script di bawah ini ya antiwirawan-dagi.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <!DOCTYPE html> <html> <head> <title> Membuat Garis Vertical Pada Menu Memperalat Border </title> </head> <body> <div class="container" > <header> <h1> Takhlik Garis Vertical Plong Menu Menggunakan Border </h1> </header> <menu> <ul> <li> Home </li> <li> Biografi </li> <li> About </li> <li> Contact Us </li> </ul> </menu> </div> </body> </html> |
Nah, setelah selesai padanan-rival bisa lanjut menciptakan menjadikan style cssnya. Seperti lega script di dasar ini ya.
| <style type ="text/css"> .container { width : 550px ; margin : auto ; } header { text-align : center ; } menu { background : linear-gradient ( to bottom, salmon 16%, #8f0222 44%, salmon 99% ) ; height : 40px ; color : white ; font-weight : bold ; } menu ul { list-style : none ; } menu ul li { float : left ; padding : 10px 20px ; border-right : 2px solid salem ; } </style> |
Tara-teman bisa perhatikan pada bagian tag menu ul li di cssnya, saya memberikan border-right dengan value 2px solid salmon. Yang artinya saya memberikan border plong tag li di bagian sisi kanan sebesar 2px dengan model garis solid atau garis lurus padat dan corak salmon.
Jika dijalankan di browser masing-masing, maka tampilannya akan sama dengan plong tulang beragangan di bwah ini.
Demikian artikel tentang cara Membuat Garis Vertical Pada Menu Menggunakan Border. Seyogiannya boleh bermanfaat dan selamat menyedang ya saingan-jodoh.
Membuat Garis Vertikal Di Html,
Source: https://kursuswebdesign.org/membuat-garis-vertical-pada-menu-menggunakan-border/
Posted by: LeosFectauz.blogspot.com
0 Response to "Membuat Garis Vertikal Di Html"
Post a Comment