오늘은 아이랑 홈페이지 만들기를 해볼거예요.
메모장만 있으면 홈페이지 문서가 뚝딱.
메모장을 열어요.
아래처럼 씁니다.
한글부분은 마음대로 써보세요.
* 대소문자 구분하지않아도 상관없어요.
이제 저장할거예요.
저장할때는 이름뒤에 확장자를 .html 이라고 써주시면 OK
바탕화면에 새로운 인터넷 파일이 생겼어요.
클릭해볼까요?
HTML 문서는 크게
머리와 몸으로 나누어져요.
머리<head>
몸 <body>
" 엄마 이거 이상해 왜 글씨가 한줄로 모아서 써지는 거야?"
줄바꾸기가 안먹히는게 보이시죠?
줄을 바꾸려면 글사이에 <ba>를 꼭 넣어줘야해요.
메모장에서 고쳐볼게요.
<html>
<head>
<title>네이버말고 네이뇽</title>
</head>
<body>
사진 넣기<br>
동영상 넣기<br>
사이트 링크 시키기<br>
</body>
</HTML>
저장을 눌러요.
짜잔! 줄 바꾸기가 됐어요.
이번엔 배경에 색을 넣어줄게요.
<html>
<head>
<title>나도 웹코딩</title>
</head>
<body>
<body bgcolor="ffffacd">
병아리 홈피에 오신걸 환영합니다.
</body>
</HTML>
백그라운드 칼라 (bgcolor)가 파스텔노랑으로 되었어요~
색상 코드표라고 네이버에 검색하면 요렇게 나오니까 찾아서 쓰세요.
음 이제 화면에 그림 한장을 띄워 볼게요.
그림은 html파일과 같은 곳에 저장되어 있다면 <파일이름>을 넣구요.
인터넷에 있는 그림을 넣고 싶으면 그림의 <인터넷 주소>를 넣으면 돼요.
<html>
<head>
<title>나도 웹코딩</title>
</head>
<body>
<body bgcolor="ffffacd">
<body background="그림파일 이름 또는 이미지 주소">
</body>
</HTML>
이런..... 그림이 무한 반복해버리네요~~~가운데 넣고 싶은데.....
이럴땐 body style을 설정해줘야해요.
명령어는 이렇게 써요.
" " 안에
이미지 주소url은 ('주소이름')쓰고 반복할건지 정해주는 명령은 ; ; 안에 씁니다.
아직 한가운데 정렬이 안되었어요. 그렇다면 position명령어를 덧붙입니다.
; ; ; 이렇게 세미콜론을 나열해서 세부 설정을 늘려가면 돼요.
그럼 오늘은 여기까지~~~~~~ 연습많이 해보아요 ^^
댓글