Cara Membuat Navbar Sederhana - HTML CSS

Tutorial lanjutannya ada disini :
Membuat Navbar Reponsive : • Cara Membuat Navbar Re...
Halo teman-teman semua, semoga video ini membantu buat yang lagi belajar CSS Dasar. Ini masih cara sederhana ya, kedepannya kita akan belajar cara yang lebih canggih lagi!!!
Silahkan share ke teman-teman yang lain agar lebih banyak yang terbantu. Jika tidak ingin ketinggalan video tutorial berikutnya, jangan lupa SUBSCRIBE yaa, nyalakan loncengnya!.
Follow saya di sosial media :
Instagram : / arsadi.dev
LinkedIn : / arsadi
Tiktok : / uicodes
Discord : / discord
Sampai ketemu di video-video berikutnya!

[@anzutsu8774]

Bang minta file html dan css nya bang

[@kelas-frontend]

Code nya ada disini ya mas : github.com/arsadii/Learn-CSS/tree/navbar-1

[@FebryanAlfaya]

Semangat terus ngontennya abangku gass gass gass

[@kelas-frontend]

@@FebryanAlfaya terimakasih🙌🔥

[@azizcanva123]

Njir keren bet dah bang yg satu ini, gua pertama kali liat video ny respect bnget ma penjelasan tutur kata nya sangat mudah dipahami jelas singkat menyenangkan buat pemula coders👏 Thanks bang👍 Banyakin tutor tutor praktek on project step by step kya gini bg, soal ny para pemula biasa ny suka bet nyari nyari video blajar praktek coding kya gini

[@kelas-frontend]

Terimakasih 🙌🙌

[@sabineazzahra2420]

Penjelasan yang mudah d fahami. Manthap bang

[@rasyan.4525]

keren bang banyakin lgi tutor kayak gini kalau bisa sampe di buat playlist tentang css 👍👍👍👍👍

[@Adyaaa88]

Bagus banget bang tiap tiap tag atribut di jelasin gw yg pemula jadi lebih paham terimakasih bang❤😊

[@kelas-frontend]

sama sama, semoga bermanfaat yaa

[@hamzahh18]

Kalo bikin navbar itu mending pake apa mending langsung aja bg? Soalnya kalo pake Unordered list, Pas list style type nya udh di none kan.. Terus pas pake padding. List nya itu masih dianggep ada bg

[@kelas-frontend]

pake ul li biar semantic sih

[@kelas-frontend]

paddingnya bisa dimanipulasi lagi

[@hamzahh18]

@@kelas-frontend maksudnya paddingnya ditambahin / dibesarin nilainya gitu ya bg

[@kelas-frontend]

@@hamzahh18 iya betul

[@darulh27]

keren kak penjelasannya detail dan gampang dipahami

[@kelas-frontend]

terimakasih

[@tristanramana640]

dibanding sama konten yang lain,jujur ini paling mudah dipahami.makasih ya mas btw bikin playlist tutor css dong mas

[@kelas-frontend]

siaappp, otw buat yaa🙌🙌

[@mr.rahmatfalaqi6520]

Semangat terus bikin videonya bang .. sudah saya subscribe dan like videonya ..

[@kelas-frontend]

terimakasih

[@mardhychannel8497]

Keren tutorial mu bro Semngat trus ya bikin konten

[@kelas-frontend]

siaap terimakasih 🙌

[@EPWGamer03]

Semangat bang bikin kontennya, kontennya sangat membantu 🔥🔥

[@fadilahrohman7542]

Makasih banget bang penjelasan kamu bang bikin saya seneng mudah dipahami 🙏 Makasih ilmunya semoga berkah

[@kelas-frontend]

aamiiin terimakasih

[@fadilahrohman7542]

​@@kelas-frontend kalo boleh tau ukuran logo nya berapa ya?

[@kelas-frontend]

@@fadilahrohman7542 bisa diatur pakai css sih, tentuin aja 50px atau berapa

[@fadilahrohman7542]

@@kelas-frontend maaf bang banyak tanya nih, untuk mindahin logo nya tanpa ngikut bagian list apakah harus tidak disertakan tag nav nya hanya div > img. Jika ada tag buat mindahin logo nya mohon bisa sertakan soalnya saya bingung masih pemula banget. *soalnya saya kurangi bar nav nya jadi kalo dikurangi logo nya tidak pas gitu..

[@kelas-frontend]

@@fadilahrohman7542 biar enak diskusinya join discord aja ya

[@willdaann4383]

semangat terus bang😊

[@wheghdje250]

Bang bisa jelaskan kode : div, nav, ul, li dan 1 lagi kalau mau buat navbar, kode pertama harus nav atau div dulu ?

[@muhammadfiqrianwar8105]

Terimakasih banyak ilmunya bang🙏🙏

[@kelas-frontend]

sama sama🙌

[@najibangbang6856]

akhirnya ketemu juga youtube sampean bang,

[@kelas-frontend]

Alhamdulillah 😂😂

[@najibangbang6856]

@@kelas-frontend saya chat di IG gak di bls bang

[@kelas-frontend]

@@najibangbang6856 maaf belum sempat cek dm lagi

[@najibangbang6856]

Siap siap bang

[@ryanprasetyo4812]

Semangat para pegiat coding🔥🙏🏻 salam titik koma();

[@kelas-frontend]

mahasiswa WPU nih😂

[@ryanprasetyo4812]

@@kelas-frontend yoi bang🙏🏻😂😆

[@imtiyazahmadrozan7502]

mantap bang 👍 semangat bikin kontennya... bikinin tutorial sidebar juga bang.

[@kelas-frontend]

siap ditunggu aja ya

[@valahivanmaulana8230]

Terimakasih bang

[@kelas-frontend]

@@valahivanmaulana8230 sama sama

[@RendiAndriansyah-oq5lp]

Semangat terus ya bang,upload yang live di tiktok dong bang🤣

[@kelas-frontend]

siap ditunggu ya

[@RendiAndriansyah-oq5lp]

@@kelas-frontend siap bang

[@RendiAndriansyah-oq5lp]

@@kelas-frontend makasih bang udah mau share ilmu mahal nya 😁

[@iqiiw]

Smngaatt bang nge konten nya ya..

[@kelas-frontend]

Terimakasih😊🙌

[@bayu_lesmana]

Terima Kasih Mas untuk Tutorialnya 🙏

[@kelas-frontend]

sama sama, semoga menbantu

[@itachianime4295]

bagus bgt nih makasih kk 😊

[@kelas-frontend]

sama sama,🙌

[@JohariInak]

Kren bang..cepet faham ae

[@whyyouaskhow]

Mas, mau nanya, saya kan nyoba" hovernya yaa.. nah itu saya mau bikin pake background color gitu bukan pake underline, tapi pas saya coba ubah" kok area backgroundnya itu kecil ya? ada saran kah mas?

[@kelas-frontend]

diperbesar coba mas width nya

[@iniky]

Lanjut bang buat tutorial web portofolio ya 😅

[@kelas-frontend]

oke ditunggu aja ya🙏😀

[@HANSENN0]

bang, mau tanya, cara pindahin nav menu nya ke tengah gimana ya?? Soal pas saya ganti ke center, icon ( logo ) nya ikut ke tengah juga.

[@kelas-frontend]

ul nya dibuat flex grow 2, trus di justify content center

[@andhika6591]

Mas mau nanya, kalo navbar nya dikasih background png bisa gak ya, jadi dibelakang tulisan home, work dll ada gambarnya, saya sudah bikin gambar kaya tombol gitu untuk background nya, terima kasih

[@kelas-frontend]

@@andhika6591 bisa. tinggal kasih style background image untuk masing masing menu item nya

[@andhika6591]

​​@@kelas-frontend oke berhasil nih, Terima kasih ilmu nya mass, sehat selalu

[@dimashm14]

bang format penulisan yg bener tuh gimana sih? kadang ada yang nulis tag header dulu, terus nanti per section nya ada yang bikin tag section ada yang gak. bingung format yg benr

[@kelas-frontend]

itu disebut semantic html, atau cara penulisan html yang direkomendasikan. gak ada yang bener, gak ada yang salah. tapi, bagusnya sesuai fungsinya. kaya kalau mau buat element diatas itu ya dibungkus header

[@yuliuspranata15]

mangat 🔥

[@nanangirwanto8808]

Untuk dapet avatar selain itu dmana bang

[@zeyouR]

salam dari programmer juga , ada discord ga bro? buat sharing2

[@kelas-frontend]

ada bang, di kolom deskripsi yaa

[@rekt201]

Terima Kasih

[@Classywrods]

bang kalo navbar ga di atur width dan heigh nya itu gpp ya

[@kelas-frontend]

@@Classywrods sesuaikan dengan kebutuhan aja🙌

[@Ikyyy124]

makasih

[@kelas-frontend]

sama sama🙌🔥

[@Pianzpeanut]

bang klo atur size gambar di index.htmlnya aman ga bg?

[@kelas-frontend]

aman sih harusnya. cuma kurang flexible aja

[@Pianzpeanut]

@@kelas-frontend okee thx bg

[@any.future]

bang aku gak bisa make tag gap pas aku coba gak muncul hasil dari tag gap: 1rem; nya

[@kelas-frontend]

udah diikutin persis seperti di video?

[@any.future]

persis @@kelas-frontend

[@kelas-frontend]

@@any.future coba join discord aja biar bisa share code nya gimna

[@vivoichsan1208]

scroll smooth navbar nya dong bang...

[@mxrmizu8884]

bang buatkan tutorial supaya pas kita masukin kodingan hasil nya bisa langsung keubah gitu

[@zakiulumudin2887]

Di live server bang,itu fitur di vs code

[@daniharmade]

extension biar bisa atur warna nya apa bang ?

[@kelas-frontend]

warna yang dimna?

[@imtiyazahmadrozan7502]

mau tanya bang box.sizing buat apa bang/

[@kelas-frontend]

untuk mengatur element kita mengambil ukuran dari mana, kalau box-sizing : border-box; berarti mengambil ukuran border, dst.

[@iputuagusyogipurnawan215]

👍

[@bims8877]

Bikin navbar lebih enak pake bootstrap biar lebih rapih

[@kelas-frontend]

iya sih memang lebih rapih kalau pakai bootstrap😄. Ini tutorial buat yang mau tau proses manualnya aja.

[@rakamaulana2286]

Bang saat scroll tulisan di halaman nya nembus di navbar,cara fixnya gimana ya😅

[@kelas-frontend]

naikin z-index navbarnya

[@rakamaulana2286]

@@kelas-frontend berapa bang?

[@kelas-frontend]

@@rakamaulana2286 kasih 10 boleh harusnya

[@rakamaulana2286]

Gak bisa bang

[@dimasadirivanto9016]

Bang mau tanya untuk mengisi halaman work nya itu bagaimana, misal ni aku punya web quiz isinya home, materi, dan home udah ke isi quiz dan cara mengisi halaman materi nya gimana ya bang, apa sama seperti ngerjain yang home atau beda?

[@kelas-frontend]

iya sama seperti home. buat html baru untuk materi,

[@dimasadirivanto9016]

@@kelas-frontendsoalnya ini di html 1 udah ada isi home sama materi nah cara ngisinya materinya berarti buat file html baru kah bang?

[@kelas-frontend]

@@dimasadirivanto9016 iya buat html baru

[@dimasadirivanto9016]

@@kelas-frontend ada contoh videonya bang??

[@muhammadrois4046]

Salam {}: ;

[@kelas-frontend]

Salaam🙌😆

[@muhammadazharibrahim6183]

bang kok di saya gambar nya ngga muncul ya?

[@kelas-frontend]

mungkin salah panggil file gambar. coba join discord aja biar bisa diliat code nya

[@mugieyono6804]

Bang saya mau nanya kok yg saya logo nya gak muncul yah?

[@kelas-frontend]

mungkin salah import src gambarnya. coba dicek lagi gambarnya apakah di dalam folder atau enggak, sesuaikan dengan src img nya ya

[@mugieyono6804]

@@kelas-frontend sudah benar semua bang src nya juga sudah benar tapi cuma muncul gambar kotak kecil gitu

[@kelas-frontend]

@@mugieyono6804 itu seperti nya masih salah. Join discord aja ya biar enak liat code nya

[@leung_rasta]

bang mo nanya kenapa ngga pake class?

[@kelas-frontend]

karena masih sederhana struktur htmlnya. jadi tanpa class pun tidak akan tabrak tabrakan stylenya. kalau udah mulai rumit struktur htmlnya, udah banyak tag yang sama dipakai di beberapa tempat, pasti bakal pakai class

[@leung_rasta]

@@kelas-frontend owalah okheey" bang paham

[@naya.234]

Kaka belajar html css brpa bulan kak

[@kelas-frontend]

kayanya sekitar 6 bulan dulu pas kuliah, 1 semester lah😅

[@naya.234]

@@kelas-frontend sekarang udh lulus kak

[@kelas-frontend]

@@naya.234 sudah

[@naya.234]

Kak aku semester 4 tapi baru mulai ngoding lagi terlambat enggak ya kak

[@naya.234]

Aku mau fokus ke front end kak

[@ajhoardi6555]

Banggg logo nya punya gua ga muncul 😂

[@kelas-frontend]

@@ajhoardi6555 salah panggil gambar mungkin

[@josefbatara4665]

Izin pake vidionya bg🙏

[@fadlanadnan6560]

Bang nama aplikasi pemograman nya apa

[@dannzedtz4ever]

Visual studio code

[@kelas-frontend]

Visual Studio Code

[@HANSENN0]

Bang, apakah perlu wrapper?

[@kelas-frontend]

bebas aja sih. kalau saya tidak perlu

[@HANSENN0]

@@kelas-frontend bang, mau tanya, cara pindahin nav menu nya ke tengah gimana ya?? Soal pas saya ganti ke center, icon ( logo ) nya ikut ke tengah juga.