8/19/2019 Cara Membuat Dropdown

1/19

Cara membuat Menu

DropdownBy Fatkhul amin, S.T.,M.Kom

KERJSMM!M" "EMSR# "R$%S& J' TE#!(

FK)*TS TEK#$*$!& F$RMS& )#&SB#K SEMR#!"E#ERB&T ER*#!!

Diklat "ema+aran $nline -/

1

 Tingkat Lanjut

8/19/2019 Cara Membuat Dropdown

2/19

Membuat Menu

• Proses pembuatan menuharus memperhatikan

cakupan blog atau web,tujuan dibuatnya web dan

tampilan menu

8/19/2019 Cara Membuat Dropdown

3/19

 Taksonomi Menu

HomeProfl

8/19/2019 Cara Membuat Dropdown

4/19

Membuat Blog Blogspot

•unakan Templatesederhana !simple"

8/19/2019 Cara Membuat Dropdown

5/19

•Halaman tidak

dibuat dahulu

8/19/2019 Cara Membuat Dropdown

6/19

8/19/2019 Cara Membuat Dropdown

7/19

8/19/2019 Cara Membuat Dropdown

8/19

#lik kode didalam kotak

8/19/2019 Cara Membuat Dropdown

9/19

$trl % &

8/19/2019 Cara Membuat Dropdown

10/19

#etik ' 00123b4+kin1

8/19/2019 Cara Membuat Dropdown

11/19

8/19/2019 Cara Membuat Dropdown

12/19

8/19/2019 Cara Membuat Dropdown

13/19

8/19/2019 Cara Membuat Dropdown

14/19

8/19/2019 Cara Membuat Dropdown

15/19

8/19/2019 Cara Membuat Dropdown

16/19

$ara membuat menu(ropdown

1) *dit $++ Blogspot

) Menentukan -arna Menu

.) adget Menu (ropdown/) *dit #ode HTML menu (rop (own

8/19/2019 Cara Membuat Dropdown

17/19

$++ Blogspot

0LatihMenu

  background' warna12

  width' 334p52

  height' .6p52

  7ont8si9e' 1p52

  7ont87amily' :rial, Tahoma, ;erdana2

  color' warna2

  7ont8weight' bold2

  margin8bottom' .4p52

  padding' p52

  <

  0Latihbo5

  width' 3=6p52

  >oat' le7t2

  margin' 42

  padding' 42

8/19/2019 Cara Membuat Dropdown

18/19

<

  0punch li

  list8style' none2

  margin' 42

  padding' 42

  <

  0punch li a, 0punch li a'link, 0punch li a'?isited

  color' warna2

  display' block2

  7ont8si9e' 1@p52

  7ont87amily' eorgia, Times Aew oman2

  7ont8weight' normal2

  te5t8trans7orm' lowercase2

  margin' 42

  padding' Cp5 16p5 3p52

  <  0punch li a'ho?er, 0punch li a'acti?e

  background' warna2

  color' warna12

  margin' 42

  padding' Cp5 16p5 3p52

  te5t8decoration' none2

8/19/2019 Cara Membuat Dropdown

19/19

<

  0punch li li a'ho?er, 0punch li li a'acti?e

  background' warna2

  color' warna12

  padding' =p5 14p52

  <

  0punch li

  >oat' le7t2  padding' 42

  <

  0punch li ul

  98inde5' CCCC2

  position' absolute2

  le7t' 8CCCem2

  height' auto2

  width' 1=4p52

  margin' 42

  padding' 42  <

  0punch li ul a

  width' 1/4p52

  <

  0punch li ul ul

  margin' 8.p5 4 4 1=1p52

  <

  0punch li'ho?er ul ul, 0punch li'ho?er ul ul ul, 0punch li)s7ho?er ul ul, 0punch li)s7ho?er ul ul ul

  le7t' 8CCCem2

  <  0punch li'ho?er ul, 0punch li li'ho?er ul, 0punch li li li'ho?er ul, 0punch li)s7ho?er ul, 0punch li li)s7ho?er ul, 0punch li li li)s7ho?er ul

  le7t' auto2

  <

  0punch li'ho?er, 0punch li)s7ho?er

  position' static2