칼퇴족 김대리는 알고 나만 모르는 HTML5+CSS3 또는 아나토미 스트레칭 가이드
땅끝
2024-12-18 10:33
100
0
본문
칼퇴족 김대리는 알고 나만 모르는 HTML5+CSS3
도서명 : 칼퇴족 김대리는 알고 나만 모르는 HTML5+CSS3
저자/출판사 : 김태광, 책밥
쪽수 : 408쪽
출판일 : 2023-04-01
ISBN : 9791190641982
정가 : 21000
CHAPTER 01 HTML과 CSS 준비하기
01. HTML, CSS 개념 알기
| 01 | 웹브라우저(Web browser)
02. 뭘 준비하죠?
⦁웹브라우저의 종류와 점유율
⦁크롬(Chrome) 브라우저 설치하기
⦁개발자 도구
실습 _ 웹사이트 [+더보기]에서 HTML 요소와 CSS 속성과 속성값 알아보기
실습 _ [개발자 도구]로 색과 내용 수정해보기
| 01 | 편집기(Editors)
실습 _ 비주얼 스튜디오 코드 파일 다운로드하기
실습 _ 비주얼 스튜디오 코드 설치하기
⦁비주얼 스튜디오 코드의 인터페이스 알아보기
⦁편리한 확장 기능 사용하기
실습 _ 영문 메뉴를 한글로 교체하기
실습 _ HTML 파일을 실시간 미리 보기
⦁코딩 속도를 높이는 기능 설정하기
CHAPTER 02 HTML 페이지 만들기
01. 태그(tag)가 뭐죠?
02. 요소(elements)가 뭐죠?
03. HTML 문서의 기본 구성
실습 _ [자동 완성] 기능을 이용해 HTML 구조 알아보기
04. 속성(Attributes)
| 01 | href 속성
| 02 | target 속성
| 03 | src 속성
| 04 | alt 속성
05. 요소(elements)의 특징
| 01 | Block level 요소(elements)
| 02 | Inline 요소(elements)
06. 텍스트(Text) 요소(elements)
| 01 | 〈h1〉~〈h6〉 제목 태그(tags)
| 02 | 문단 〈p〉 태그
| 03 | 줄 바꿈 〈br〉 태그
| 04 | 특수코드 문자(entity)
| 05 | 문자 강조 태그
| 06 | 주석(comment)
실습 _ HTML 문서 만들기
07. 이미지(Images) 태그와 속성
| 01 | 〈img, src, alt〉를 이용하여 이미지 삽입하기
| 02 | 이미지 파일 경로(file paths)
| 03 | HTML에서 사용할 수 있는 이미지 파일 형식
실습 _ 이미지 삽입하기
08. 하이퍼링크(Hyperlinks)
| 01 | 이미지에 링크 적용하기
| 02 | 텍스트에 링크 적용하기
| 03 | 이메일에 링크 적용하기
| 04 | 주소(URL) 입력하기
실습 _ 이미지를 클릭해 새로운 탭(페이지)으로 열기
실습 _ 텍스트를 클릭해 새로운 탭(페이지)으로 열기
09. 목록(List) 태그
| 01 | 순서 없는 목록〈ul li〉
| 02 | 순서 있는 목록 〈ol li〉
실습 _ 순서 없는 목록에 순서 적용하기
10. 표(Table) 태그
실습 _ 3열 3행 표 만들기
11. 폼(Form) 태그
| 01 | 인풋(input) 태그
| 02 | 레이블(label) 태그
실습 _ 아이콘이 있는 검색 폼 만들기
12. 버튼(button) 태그
13. 미디어(Media) 태그
| 01 | 비디오(video) 태그
| 02 | 오디오(audio) 태그
| 03 | 유튜브(youtube) 연결
실습 _ 유튜브 영상을 HTML 페이지에 삽입하기
14. 의미론적인 요소로 구성된 HTML5 페이지 구조
| 01 | 헤더(header) 태그
| 02 | 내비게이션(nav) 태그
| 03 | 섹션(section) 태그
| 04 | 아티클(article) 태그
| 05 | 어사이드(aside) 태그
| 06 | 푸터(footer) 태그
실습 _ 의미론적 HTML 페이지 만들기
CHAPTER 03 CSS로 HTML 페이지 스타일링하기
01. CSS 입력법(Syntax)
02. 선택자(Selectors)의 종류
| 01 | 요소(element)
| 02 | 아이디(#)
| 02 | 클래스(.)
| 03 | 모든(*)
| 04 | 그룹(,)
| 05 | 자손 선택자(한 칸 띄기)
| 06 | 자식 선택자(〉)
03. 가상(pseudo) 클래스
04. HTML 페이지에 CSS 연결하기
| 01 | 외부(External CSS) 스타일
| 02 | 내부(Internal CSS) 스타일
| 03 | 인라인(Inline CSS)
실습 _ 제목 글자 색 적용하기
05. 폰트(Fonts)
| 01 | 패밀리(family)
| 02 | 스타일(style)
| 03 | 사이즈(size)
| 04 | 웨이트(font-weight)
| 05 | 구글 웹폰트(Google Web fonts)
실습 _ 구글 웹폰트 적용하기
06. 컬러(color)
| 01 | 이름(names)
| 02 | 16진수(HEX:Hexadecimal)
| 03 | RGB(Red, Green, Blue)
| 04 | HSL(Hue, Saturation, Lightness)
| 05 | 컬러 선택기(Color Picker)
07. 텍스트 스타일링(Text styling)
| 01 | 텍스트 정렬(align)
| 02 | 데코레이션(decoration)
| 03 | 들여쓰기(indent)
| 04 | 자간(letter spacing)
| 05 | 단어 간격(word spacing)
| 06 | 행간(line height)
08. 박스 모델(Box Model)
| 01 | 크기(width, height)
| 02 | 테두리 선(border)
| 03 | 여백(padding, margin)
⦁Padding(안쪽 여백)
⦁Margin(바깥 여백)
| 01 | 둥근 모서리(radius)
| 02 | box-sizing
09. 레이아웃(Layout)
| 03 | float
| 04 | clear
| 05 | overflow
⦁이미지와 내용을 2단으로 레이아웃 구성하기
| 01 | display
| 02 | position
| 03 | flexbox
⦁부모(container)에서 사용하는 수평축 정렬 속성들
◇ flex
◇ flex-direction
⑴ flex-direction : column
⑵ flex-direction : column-reverse
⑶ flex-direction : row
⑷ flex-direction : row-reverse
◇ flex-wrap
⑴ flex-wrap : wrap
⑵ flex-wrap : no- wrap
⑶ flex-wrap : wrap-reverse
◇ justfy-contents
⑴ justfy-contents : flex-start
⑵ justfy-contents : flex-end
⑶ justfy-contents : center
⑷ justify-contents : space-between
⑸ justify-contents : space-around
⑹ justify-contents : space-evenly
⦁부모(container)에서 사용하는 수직축 정렬 속성들
◇ align-items
⑴ align-items: stretch
⑵ align-items: center
⑶ align-items: flex-start
⑷ align-items: flex-end
⑸ align-items: baseline
◇ align-contents 속성
⑴ align-content : space-between
⑵ align-content : space-around
⑶ align-content : stretch
⑷ align-content : center
⑸ align-content : flex-start
⑹ align-content : flex-end
⦁자식(item)에서 사용하는 속성들
◇ order
◇ flex-grow
◇ flex-shrink
◇ flex-basis
◇ flex
◇ align-self
실습 _ flexbox를 이용하여 HTML5 문서 레이아웃 디자인하기
| 07 | z-index
실습 _ z-index 속성 적용하기
z-index 속성을 활용해 겹침 순서 지정하기
10. 배경(background)
| 01 | 배경색(background color) 적용하기
| 02 | 배경에 이미지(background image)
넣기
⦁background-image
⦁background-repeat
⦁background-position
⑴ background-position : 키워드
⑵ background-position : 좌푯값
⦁background-size
⑴ background-size
⑵ background-size 속성의 속성값 비교 : auto, contain, cover
| 03 | 불투명도(opacity)
CHAPTER 04 실전 예제 웹사이트 만들기
01. 메인 페이지 만들기
| 01 | 메인 페이지 HTML 구성과 공통 CSS 만들기
| 02 | 메인 페이지에 로고와 GNB 만들기
| 03 | 이벤트 배너 배치하기
| 04 | 이미지 수평 정렬 만들기
| 05 | 유튜브 삽입하기
| 06 | 섬네일 갤러리와 뉴스 리스트 만들기
| 07 | footer 만들기
| 08 | 상단으로 이동하는 [top] 버튼 만들기
02. 서브 페이지 만들기
| 01 | 서브 페이지 HTML 구성
| 02 | 브레드크럼(breadcrumb) 만들기
| 03 | 제목과 이미지 수직 정렬 만들기
| 04 | 배경색 위에 섬네일 이미지 수평 정렬 만들기
| 05 | 제목과 이미지 가운데 정렬 만들기
| 06 | GNB 메뉴에 페이지로 이동하는 하이퍼링크 적용하기
| 부록 | 칼퇴족에게 유용한 사이트 모음
아나토미 스트레칭 가이드
도서명 : 아나토미 스트레칭 가이드
저자/출판사 : 프레데릭 데라비에 , 장 피에르 클레망소 , 마이클 , 삼호미디어
쪽수 : 192쪽
출판일 : 2023-06-05
ISBN : 9788978496872
정가 : 20000
Part 01 올바른 스트레칭을 위한 기본 상식 12
01 근력 사용이 아닌 감각을 이용한 자연적인 방식 14
02 호흡하는 방법부터 배우자 17
03 운동선수에게 스트레칭이 중요한 이유 22
Part 02 상반신 집중 스트레칭 32
01 목 스트레칭 36
목 스트레칭 38
목 측면 스트레칭 41
목 후면 스트레칭 42
목 전면 스트레칭 43
02 가슴과 어깨 스트레칭 44
어깨 전면 스트레칭 50
전면삼각근 스트레칭 52
어깨 후면 스트레칭 55
어깨와 삼두근 스트레칭 58
어깨와 흉근 스트레칭 60
대흉근 스트레칭 62
03 팔 근육 스트레칭 64
이두근과 흉근 스트레칭 65
삼두근 스트레칭 67
팔 앞부분의 굴근 스트레칭 70
팔 앞부분의 신근 스트레칭 73
04 몸통 측면 굴근 스트레칭 75
몸통 측면 굴근 스트레칭 76
몸통 측면 굴근과 배근 스트레칭 78
05 몸통 회전근 스트레칭 82
앉아서 몸통 회전근 스트레칭 84
몸통 회전근과 햄스트링 스트레칭 85
몸통 회전근·햄스트링·엉덩이 근육 스트레칭 86
누워서 하는 몸통 회전근 스트레칭 88
몸통 회전근과 허리 아랫부분 스트레칭 92
06 등을 이완하는 스트레칭 93
허리와 복부 스트레칭 96
요근 스트레칭 99
허리 스트레칭 101
허리과 둔근 스트레칭 102
배근 스트레칭 103
등·승모근·햄스트링 스트레칭 107
Part 03 하반신 집중 스트레칭 108
01 둔부와 허리 스트레칭 110
바닥에 앉아서 하는 둔부과 허리 스트레칭 111
의자에 앉아서 하는 둔부와 허리 스트레칭 1 113
의자에 앉아서 하는 둔부와 허리 스트레칭 2 115
02 둔근 스트레칭 118
앉아서 하는 둔근 스트레칭 119
누워서 하는 둔근 스트레칭 121
서서 하는 둔근 스트레칭 122
의자를 이용한 둔근 스트레칭 123
03 대퇴사두근 스트레칭 125
바닥에서 하는 대퇴사두근 스트레칭 127
한 방향으로 하는 대퇴사두근 스트레칭 129
균형을 유지하며 대퇴사두근 스트레칭 130
서서 하는 대퇴사두근 스트레칭 131
04 햄스트링 스트레칭 136
서서 한 방향으로 하는 햄스트링 스트레칭 137
서서 양방향으로 하는 햄스트링 스트레칭 141
누워서 하는 햄스트링 스트레칭 145
의자에 앉아서 하는 햄스트링 스트레칭 148
햄스트링과 내전근 스트레칭 150
05 내전근 스트레칭 151
지지대를 이용해 다리를 펴는 내전근 스트레칭 153
지지대를 이용해 다리를 구부리는 내전근 스트레칭 155
앉아서 하는 내전근 스트레칭 157
양반다리 자세로 하는 내전근 스트레칭 159
바닥에 앉아서 하는 햄스트링 스트레칭 161
서서 하는 내전근과 햄스트링 스트레칭 162
한 방향으로만 벌리는 내전근과 햄스트링 스트레칭 163
06 종아리 스트레칭 165
서서 하는 종아리 스트레칭 168
다리를 구부려서 하는 종아리 스트레칭 169
다리를 벌려 하는 종아리 스트레칭 171
종아리와 발목 스트레칭 172
Part 04 맞춤형 스트레칭 프로그램 174
01 근육 단련과 건강 유지를 위한 스트레칭 프로그램 176
초보자 프로그램 176
중급자 프로그램 178
고급자 프로그램 179
02 전문 운동선수를 위한 스트레칭 프로그램 181
공통 프로그램 182
회전 운동 종목(골프, 야구 등) 선수를 위한 프로그램 183
육상, 축구, 스케이트 선수를 위한 프로그램 184
스키 선수를 위한 프로그램 185
투기 종목 선수를 위한 프로그램 186
사이클 선수를 위한 프로그램 187
던지기(창던지기, 야구, 핸드볼 등) 종목 선수를 위한 프로그램 188
승마 선수를 위한 프로그램 189
수영 선수를 위한 프로그램 190
웨이트 트레이닝을 위한 프로그램 191
댓글목록0