workshop4

ࠛഛपೠ ೟Ү 4

1. HTML ಫ؊ ٜ݅ӝ 2. ࢲ࠳ۄ੐ীࢲ ੋؙझ ݅ٚ׮

1. HTML ಕ੉૑ ٜ݅ӝ

ࢲ࠶ۄ੐ীࢲ ࢜ ౵ੌ ٜ݅Ҋ index.html ਵ۽ ੷੢ೞӝ ݾର

<!DOCTYPE HTML> ޙࢲ੄ ઙܨ Document Type

ইޖ۠ ੿ࠁо হ਺

<head> <title>੉ ಕ੉૑ ઁݾ</title> </head> ৈ۞࠙੄ ಕ੉૑ ઁݾਸ ੑ۱ೞࣁਃ. ৘:
ࠛഛपೠ ೟Ү ই౭झ౟ ಕ੉૑

ೳ. ӵ઎׮!

<html> </html> html ޙࢲ੄ द੘ html ޙࢲ੄ ՘

<html lang="ko"> </html> html੄ ઱ ঱য ೠҴয ࢶ঱

<body> <p> Ӗ ղਊ </p> </body> ߄٣੄ द੘ ߄٣੄ ՘
paragraph ౵ۄӒۄ೐ ױۅ

<div style = "width:50%; margin:auto;"> <p> Ӗ ղਊ </p> </div>
٣࠳੄ द੘ ٣࠳੄ ՘ ઺ঔী ੿۳

</p> </p>

align="center"

source ࣗझ image ੉޷૑

CSS ਤ஖

<!DOCTYPE HTML> <html lang=“ko”> <head> <title>ࠛഛपೠ ೟Ү</title> <style> </style> CSS
ਤ஖

CSS ҳઑ ࢸݺ

੉ܴࠗܰӝ झఋੌݺ۸ೞӝ

h1੄ ࢝ӭ ߄Լࠁӝ <!DOCTYPE HTML> <html lang=“ko”> <head> <title>ࠛഛपೠ ೟Ү</title>
<style> h1 {font-color: pink;} </style>

ఫझ౟ झఋੌ ૑੿

Ҹӝ/ӝ਎੐ ࢝ӭ ૑੿ ੗р ઑ੿ ೯р ઑ੿ ੿۳

Ҹӝ ૑੿ p { font-weight : bold; } উ֞ೞࣁਃ উ֞ೞࣁਃ

ӝ਎੐ ૑੿ p { font-style : Italic; }

࢝ӭ ૑੿ p { font-color : green; } উ֞ೞࣁਃ উ֞ೞࣁਃ

੗р ઑ੺ p { letter-spacing : -1px } উ ֞
ೞ ࣁ ਃ উ ֞ ೞ ࣁ ਃ ગѱ ևѱ p { letter-spacing : 5px } /*ગѱ*/ /*ևѱ*/

೯р ઑ੺ p { line-height : 20px } উ֞ೞࣁਃ য়ט
զॿ ଵ જ֎ਃ ગѱ ևѱ p { line-height : 40px } /*ગѱ*/ /*ևѱ*/ উ֞ೞࣁਃ য়ט զॿ ଵ જ֎ਃ

Ӗ੗ झఋੌ ߄Լࠁӝ <style> h1 {font-color: pink;} body { background-color
: yellow;} p { font-color: blue; font-style : Italic; font-weight : bold; letter-spacing : -1px; line-height : 30px; }

݂௼ झఋੌ ߄Լࠁӝ <style> h1 {font-color: pink;} body { background-color
: yellow;} p { font-color: blue; font-style : Italic; font-weight : bold; letter-spacing : -1px; line-height : 30px; }

ߓ҃࢝ ߄Բӝ

ߓ҃࢝ ߄Լࠁӝ <style> body { background-color : yellow;} </style>

݂௼ झఋੌ ૑੿

݂௼ झఋੌ ૑੿ a { font-color : orange } ௿ܼ
੹ ݂௼ 홈으로 ௿ܼ റ ݂௼ 홈으로 ௿ܼ ੹ ݂௼ 홈으로 ௿ܼ റ ݂௼ 홈으로

݂௼࢝ ߄Լࠁӝ <style> body { background-color : yellow;} a {
font-color : orange; } </style>

୶о ݂௼

IUUQXXXXTDIPPMTDPNDTTEFGBVMUBTQ CSS۽ ؊ ׮নೠ झఋੌਸ ૑੿ೞח Ѫਸ ҕࠗೞҊ रਵद׮ݶ

IUUQXXXXTDIPPMTDPNDPMPSTDPMPST@OBNFTBTQ рױ൤ ֍ਸ ࣻ ੓ח ࢚ٜ࢝ ੉ܴਸ ঌҊरਵदݶ

workshop4

workshop4

More Decks by Taeyoon Choi

Featured

Transcript