1주차 학습내용
브라우저의 구성 (html-뼈대, css 꾸미기, javascript 동적요소) 및 사용법
=========================================================================
- hmtl
- html 구성 ( <head> url 이용/ 웹페이지상단머릿말, <body> 구성요소)
- body 에쓰이는 html 문법요소들
<div> :구역나누기 <p>:한줄띄우기 <h1 ~5>/ 페이지의 제목(크기1~5))
<span> 특정글자 꾸미기
<a herf='URL">하이퍼 링크태그
<hr>
a 태그입니다: <a href="http://naver.com/"> 하이퍼링크 </a>
<hr>이런식으로이용
<input ype =text> :인풋테그 텍스트 박스생성
============================================================================
- CSS
- CSS사용법 (클래스 디자인)
-<style> 란에서 에디트한다
-꾸밀때는 항상 '클래스!" 로지칭을해야한다 (클래스 사용법 body의 <> 사이에 class='클래스명' 삽입
ex. <h1 class = "maintitle">)
이렇게 <style> 란에서 명명하는 클래스가 된다
-<style>란에서 에디트할때는 .클래스명{ 꾸미기코드} 이렇게 사용한다
*꾸미기코드는 강의 자료 1-5 에있음
(뒷배경쓸때 background -image ="url" 그외 -size = cover; -position = center; 는 외우는것이 편함)
-참고자료
(margin :안쪽여백 pedding :바깥여백 중간으로 맞추기 : width 와 height 설정후 margin auto;!설정
백그라운드는 100%프로 입력시 꽉찬다는뜻 웹페이지 메인만들때 display flex 활용)
-중요! 포괄적인 css변경을위해서는 클래스를 묶어서 선언해야한다
<div>로 포괄적인 꾸미기를할곳을 묶고 그곳에 클래스를 지정한다 - CSS (구글웹폰트)
https://fonts.google.com/?subset=korean에서 폰트를 고른뒤
-3번째 herf링크 복사하여 <head>란에넣는다
-그후 <style>에서 *{ 폰트내용;} 을 넣는다 - 주석처리 : 컨트롤 /
- CSS (부트스트랩)
https://getbootstrap.com/docs/5.0/components/buttons/ 링크에서 필요한 디자인을 가져와서 <body>에 넣는다
이후 변수값에 원하는 데이터를 삽입 - CSS(이모티콘) https://kr.piliapp.com/facebook-symbols/ 활용하기 복붙하면된다
============================================================================
- Java Script
- <script> 란에서 설정
- java문법
-list [ i ] : list 배열의 i 번째 또는 i 의 내용 를 지칭
-alert(x) : 창에 x를 띄운다
-console.log (x) : 콘솔창에 x를 띄운다
-if 문 for 문은 기존 JAVA 언어와 매우 유사하다 - 자바 문법을 통해 함수적인 기능을 부여한다
============================================================================
1주차 복습을 마치며.. 어려운 내용은 없었지만 요약해보면
프론트엔드의 3요소 html/css/ javascript 의 기본적인사용법을 배웠다
'개발이야기 > 항해일지' 카테고리의 다른 글
| 항해99 7기 d반 7조 미니프로젝트 S.A (0) | 2022.05.09 |
|---|---|
| 종합반 2주차 복습 (0) | 2022.04.29 |
| 웹개발 종합반 5주차 (0) | 2022.04.28 |
| 웹개발 종합반 3주차 (0) | 2022.04.26 |
| 웹개발 종합반 2주차 (0) | 2022.04.24 |
