Anda di halaman 1dari 9

Nama:

Fadl
i
laRahma

NPM :
1811050114

Kel
as:
5SI
-P2

Mat
aKul
i
ah:
Mobi
l
ePr
ogr
ami
ng

1.Ber
dasar
kansi
fatkont
ent
nya,Websi
tedi
bedakanmenj
adiber
apa?Sebut
kandan
j
elaskan.

1.
CMS

CMS adal
ah per
angkatl
unak at
au si
stem y
ang di
gunakan unt
uk membuatdan
mengat
ur kont
en di
git
al.Beber
apa CMS y
ang pal
i
ng bany
ak di
gunakan adal
ah
Wor
dPr
ess,Jooml
a!,danDr
upal
.Meski
punmembuatwebsi
tedenganCMSt
ermasuk
mudah,Ki
tat
etap per
lu mempel
ajar
icar
a penggunaanny
a.Masi
ng-
masi
ng CMS
mempuny
aicar
aker
jay
angber
beda.

2.Websi
teBui
l
der

Websi
tebui
l
dercocokunt
ukKi
tay
angi
ngi
nmembuatwebsi
tedal
am wakt
usi
ngkat
,
t
idak mempuny
aikemampuan t
ekni
s dan t
idak ada wakt
u unt
uk mempel
ajar
iny
a.
Beber
apacont
ohwebsi
tebui
l
derpopul
eradal
ahWi
x,Si
teBui
l
der
,danWeebl
y.
Kel
ebi
han
dar
iwebsi
tebui
l
deradal
ahpenggunamendapat
kanpaketl
engkapmembuatwebsi
te,
dar
ihost
ing,domai
n,hi
nggapi
l
ihant
empl
ate.Penggunahany
aper
lumenggant
ikont
en
sesuai
yangdi
i
ngi
nkandanbi
sadi
bant
uol
ehsuppor
tdar
ipeny
edi
awebsi
tebui
l
der
.

3.HTMLdanCSS

Met
odemembuatwebsi
tet
erakhi
rinimemer
lukanpenget
ahuant
ent
angcodi
ngdan
pemr
ogr
amanmenggunakanHTMLdanCSS.Ki
tabi
samembuatkodeunt
ukwebsi
te
menggunakansof
twar
eseper
tiNot
epad++,
TextWr
angl
er,
atauSubl
i
meText
.
2.Apapenger
ti
anHTML?t
uli
skanst
rukt
urpenul
isant
agHTML

HTMLadal
ahsi
ngkat
andar
iHy
per
textMar
kupLanguangey
angmer
upakanbahasa
unt
ukmemudahkan pengguna saatmengel
ola at
au mengat
ursebuah dat
a dal
am
bent
ukdokumenpadawebsi
te.

St
rukt
urpenul
i
sant
agHTML:

<!
DOCTYPE 
html
>
<ht
ml>
 
 <head>
 
  
 <t
it
le>Judul
Hal
aman</
ti
tl
e>
 
 </
head>

 
 <body
>
 
  
 <!
--El
emenHTMLy
angadadi
sini
akandi
tampi
l
kanpadabr
owser-
->
 
 </
body
>
</
html
>

3.Apay
angandaket
ahuit
ent
angHTML5?Jel
askandant
uli
skanst
rukt
urpenul
isan
t
agHTML5

HTML5adal
ahsi
ngkat
anHy
perTextMar
kupLanguageVer
si5,HTML5mer
upakan
sebuaht
eknol
ogipener
usdar
igener
asisebel
umny
a dengant
ambahan 
feat
ure-f
eat
ure
bar
uunt
ukmemper
bai
kidanmel
engkapi
dar
iHTMLv
ersi
sebel
umny
a.

St
rukt
urpenul
i
sanny
a:

<header
>

<h1>Judul
Websi
te</
h1>

<i
mgsr
c=”
logo_
websi
te.
png”
/>

</
header
>
4.Tul
iskancont
oht
agHTMLbeser
taf
ungsiat
aukegunaanny
a,Mi
nimal30macam
t
ag.

NO NamaTag Fungsi
nya
1  
<!DOCTYPEht
ml> Dekl
arasi
unt
ukmendef
ini
sikandokumenmenj
adi
HTML
2 <ht
ml> Tagpembukaunt
ukmembuatdokumenHTML
3  
<head> I
nfor
masi
met
atent
angdokumen
4  
<ti
tl
e> Membuatj
udul
hal
amany
angnant
iny
aakandi
tampi
l
kandi
br
owser
5  
<body
> Tempatdi
buat
nyasemuakont
enwebsi
temenggunakan
HTML
6  
<h1>s/
d<h6>  
Membuatj
udul
atauheadi
ng
7 <hr
> Memi
sahkankont
en(
biasany
adi
tampi
l
kangar
ispembat
as)
8  
<p>  
Membuatpar
agr
af
9 <br
>  
Membuatgar
isbar
u
10 <pr
e>  
Memf
ort
matt
eksat
aukal
i
mat
11  
sty
le  
Atr
ibutunt
ukel
emenst
yli
ngpadaHTML
12 backgr
ound-
col
or  
Member
ikanwar
nal
atarbel
akang
13 col
or  
Member
iwar
napadat
eks
14 f
ont
-f
ami
l
y  
Mengubahf
ontpadat
eks
15 f
ont
-si
ze  
Mengat
urukur
anf
ont
16 t
ext
-al
i
gn  
Mengat
uraper
ataant
eks
17 <b>  
Membuatt
ekst
ebal
18 <st
rong>  
Membuatt
ekspent
ing
19 <i
>  
Membuatt
eksmi
ri
ng
20 <em>  
Membuatt
eksdi
tekankan
21 <mar
k>  
Membuatt
eksdi
tandai
22 <smal
l
>  
Membuatt
ekskeci
l
23 <del
>  
Teksdi
hapus
24 <i
ns>  
Teksdi
masukan
25 <sub>  
Tekssubscr
ipt
26 <sup>  
Tekssuper
scr
ipt
27 f
loat Pr
oper
tiunt
ukf
loati
magepadaCSS
28 <map> Mendef
ini
sikangambarpet
a
29 <ar
ea> Mendef
ini
sikanar
eaat
audaer
ah-
daer
ahgambarpadapet
a
30 <pi
ctur
e> Menampil
kangambary
angber
bedaunt
ukper
angkaty
ang
ber
beda

5.Tul
iskanmacam macam t
agdal
am HTML5,
danapakegunaanny
a.

NamaTag Fungsi
nya

<!
DOCTYPE> Tagunt
ukmenent
ukant
ipedokumen

Mengi
sol
asi
bagi
andar
iteksy
angdapatdi
for
matdal
am ar
ah
<bdi
>
y
angber
bedadar
iteksl
aindi
luar
nya

<t
it
le> Tagunt
ukmembuatj
udul
dar
isebuahhal
aman

<body
> Tagunt
ukmembuatt
ubuhdar
isebuahhal
aman

<h1>t
o<h6> Tagunt
ukmembuatheadi
ng

<br
> Memasukansat
ubar
isput
us

<hr
> Tagunt
ukmembuatper
ubahandasarkat
adi
dal
am i
si

<mar
k> Tagunt
ukmembuatt
eksy
angdi
sor
ot/di
tandai
 

<pr
ogr
ess> Memper
li
hat
kankemaj
uant
ugas

<t
ime> Tagunt
ukmembuatt
anggal
/wakt
u

Di
gunakanunt
ukmenggambargr
afi
k,mel
alui
scr
ipt
ing
<canv
as>
(
Jav
aScr
ipt)
<f
igcapt
ion> Tagunt
ukmembuatsebuahcapt
ionunt
ukel
emen<f
igur
e> 

<f
igur
e> Menent
ukankont
enmandi
ri
 

<met
er> mendef
ini
sikanukur
any
angsudahdi
tet
apkan

<nav
> mendef
ini
sikannav
igat
ionl
i
nk

<noscr
ipt
> mendef
ini
sikanbagi
annoscr
ipt

<obj
ect
> mendef
ini
sikansebuahobj
ect

<ol
> mendef
ini
sikandaf
tarangka

<opt
group> mendef
ini
sikangr
uppi
l
han

<opt
ion> mendef
ini
sikandr
op-
downopt
ion

<out
put
> mendef
ini
sikanbeber
apaj
eni
sout
put

<p> mendef
ini
sikanpar
agr
aph

<r
t> menj
elaskant
ent
anfpenngunaanr
uby

<r
uby
> mendef
ini
sikanr
ubyannot
ati
ons.
6.Apay
angandaket
ahuit
ent
angCSS?Tul
iskanf
ormatpenul
isanCSS.

CSSadal
ahsi
ngkat
andar
iCascadi
ngSt
yleSheet
 mer
upakanat
uranunt
ukmengat
ur
beber
apakomponendal
am sebuahwebsehi
nggaakanl
ebi
hter
str
ukt
urdanser
agam.
CSSbukanmer
upakanbahasapemogr
aman.

For
matpenul
i
sanCSSdal
am HTML:

a.I
nter
nal
CSS

di
tul
i
sdi
dal
am t
ag 
<st
yle>.I
ntar
nal
CSSj
ugadi
kenaldengansebut
an 
EmbededCSS.
Tag 
<st
yle> 
biasany
adi
tul
isdi
dal
am t
ag 
<head>.Bi
saj
ugadi
tul
isdi
dal
am 
<body
>,
namunl
ebi
hbany
akdi
tul
i
sdidal
am 
<head>.Mi
sal
nya:

<head>
<t
it
le>Cont
ohI
nter
nal
CSS</
tit
le>
<!
--penul
isani
nter
nalcssdal
am t
aghead-
->
<st
ylet
ype="
text
/css"
>
p{
f
ont
-f
ami
ly
:ser
if
;
l
ine-
hei
ght
:1.
75em;
f
ont
-si
ze:18px;
}
</
sty
le>
</
head>

b.I
nli
neCSS
Adal
ahkodeCSSy
angdit
uli
slangsungpadaatr
ibutel
emenHTML.Seti
ap
el
emenHTMLmemi l
i
kiat
ri
but 
styl
e,disanal
ahinli
neCSSdi
tul
i
s.Misal
nya:

<h2st
yle="
col
or:
red;
font
-f
ami
ly
:sans;
">I
nij
udul
art
ikel
</h2>

c.Ekst
ernal
CSS
adalahkodeCSSy angdi
tuli
ster
pisahdengankodeHTML.Ekster
nalCSSdi
tul
is
di
sebuahfi
lekhususyangberekst
ensi 
.css.Unt
ukmenggunakanCSSter
sebut
dal
am HTML, ki
taper
lumengimpornya.

Per
tamamenggunakant
ag 
<li
nk>
<l
inkr
el="
sty
lesheet
"ty
pe="
text
/css"hr
ef="
sty
le-
ku.
css"
>

At
aubi
saj
ugabi
samenggunakan 
@impor
t

<sty
letype="
text
/css"
>
@import"
styl
e-ku.
css"
;
</st
yle>

7.Sebut
kanbeber
apacar
apenempat
ankodeCSS

Car
apenempat
ankodeCSSdal
am HTML:

Per
tamamenggunakant
ag 
<li
nk>

<l
inkr
el="
sty
lesheet
"ty
pe="
text
/css"hr
ef="
sty
le-
ku.
css"
>

At
aubi
saj
ugabi
samenggunakan 
@impor
t

<sty
letype="
text
/css"
>
@import"
styl
e-ku.
css"
;
</st
yle>

8.Sebut
kanbeber
apamacam sel
ect
orCSS(
Mini
mal4)
?Tul
iskancont
ohny
a

1.SelektorTag
Sel
ekt orTagdisebutj
uga Ty
peSelect
or.Sel
ekt
ori
niakanmemi
l
ihel
emen
berdasarkannamat ag.Cont
ohny
a:

p{
col
or:bl
ue;
}

2.Sel
ekt
orcl
ass

adal
ahsel
ekt
ory
angmemi
l
ihel
emenber
dasar
kannamacl
assy
angdi
ber
ikan.
Sel
ekt
orcl
assdi
buatdengant
andat
it
ikdi
depanny
a.Cont
ohny
a:

.
pink{

col
or:white;
background:pi
nk;
padding:5px;
}
2.Sel
ektorID
Sel
ektorIDhampirsamadenganclass.Bedany
a,IDbersi
fatuni
k.Hanyabol
eh
di
gunakanolehsatuelemensaj
a.Selekt
orIDdit
andaidengantandapagar(
#)di
depannya.Cont
oh:

#header{
backgr ound:t
eal
;
col
or:whi te;
hei
ght :100px;
padding:50px;
}
4.Sel
ektorAtri
but
Sel
ektoratr
ibutadal
ahselektory
angmemi l
i
kelemenber
dasar
kanat
ri
but
.Sel
ekt
ori
ni
hampirsamaseper t
isel
ektorTag.Cont
ohnya:

i
nput[type=text
]{
background:none;
col
or:cy an;
padding:10px;
border:1pxsoli
dcyan;
}

Anda mungkin juga menyukai