IT전문교육 의 리더!

HOME>IT전문가>핵심 웹표준퍼블리셔>반응형웹 [실무]

반응형웹 [실무]

20회차 속성과정|전체 : 10시간 13분|회차당 평균 : 30분38초
반응형웹 [실무] / 2개월
반응형웹 [입문 + 실무] / 4개월
300,000 185,000
  • 전문강사 : 채명수
Study Guides
반응형웹 [전문과정]은 알지오에서 배출된 웹퍼블리셔들의 요청에 의해 제작된 강의로, 전문가를 위한 강의입니다.

반응형웹은 많은 웹사이트를 제작해보고 분석해봐야 완벽해질 수 있기 때문에 실제 전문가들이 제작한 웹사이트를 대상으로 강의를 진행합니다.
 
  • 0120분 실제적용 사례 CSS실무코딩 11

    책갈피 : [00:07] 웹사이트 확인/[00:21] 소스 보기/[00:47] 기본적으로 선언된 사항/[01:23] div id=site/[02:42] div id=header/[03:34] 메뉴가 밀릴 경우/[04:30] 로고/[05:15] 화면이 줄어들었을 경우/[06:00] 모바일일 경우/[07:00] div id=contact/[08:15] 태블릿 이하 적용 사항 확인/[09:33] ul id=nav/[10:33] 변경 사항 확인/[11:37] 태블릿 이하 적용 사항 확인/[12:56] div id=illustration-parts/[14:18] 버튼/[15:07] cta-grey/[16:11] div class=markers/[17:32] div class=section/[17:52] 첫번째 섹션 확인/[18:56] 모바일일 경우

  • 0218분 실제적용 사례 CSS실무코딩 12

    책갈피 : [00:00] 두번째 섹션/[00:41] 다르게 적용된 부분 확인/[01:45] nth-child/[02:06] 세번째 섹션/[02:48] 설정 값 확인/[04:15] div id=partners/[04:42] 설정 값 확인/[06:11] 하단 footer/[06:42] div class=center clearfix/[07:47] 모바일 사이즈일 경우/[08:44] ul id=client-services/[09:36] 2페이지 보기/[10:31] div id=header/[11:09] pc 화면일 경우/[12:14] 제목글 보기/[12:51] 태블릿일 경우 변경사항 확인/[13:22] ul 부분/[13:40] 화면 줄인 후 확인/[15:31] div class=work/[16:54] 내용이 두줄이 될 경우

  • 0319분 실제적용 사례 CSS실무코딩 13-1

    책갈피 : [00:02] 웹페이지 확인/[00:10] 소스 보기/[00:24] div id=testata/[00:46] 기본 pc일 경우/[02:00] div id=menu/[02:38] 기본 pc일 경우/[03:00] 태블릿일 경우/[04:15] 로고/[04:24] div class=wrap/[05:30] 와이드일 경우/[06:11] 모바일일 경우/[06:41] 대 화면 로고 css 확인/[07:55] 태블릿일 경우/[09:05] a id=expand_menu/[09:58] 이미지/[11:09] span id=expand_button/[12:28] ul class=menu left it/[13:18] 메뉴가 두줄이 됐을 경우/[13:46] 태블릿일 경우/[14:18] css 정의 확인/[15:20] 모바일일 경우/[16:33] li에 a가 있을 경우/[17:15] pc와 와이드 화면 일때 비교/[18:07] 모바일일 경우

  • 0426분 실제적용 사례 CSS실무코딩 13-2

    책갈피 : [00:06] ul class=menu right it/[00:56] div id=lingue/[01:27] 태블릿일 경우/[02:15] 모바일일 경우/[02:46] div의 ul 목록/[04:09] div class=imgtestata/[04:44] css 정의 확인/[05:57] div id=content/[06:19] pc와 와이드일 경우/[06:46] 소스 오류/[07:10] 태블릿일 경우/[08:19] div class=wrap/[08:40] 와이드일 경우/[09:02] pc일 경우/[10:08] 모바일일 경우/[10:52] div class=left_home/[12:31] div class=right_home/[13:23] div id=slide_vini/[13:36] 와이드, pc일 경우/[14:18] 태블릿, 모바일일 경우/[14:55] 이미지 내용 확인/[15:16] 이미지가 pc 버전에서 오버되는 이유/[17:12] div id=news_home/[17:18] 와이드, pc일 경우/[18:04] footer 내용 확인/[18:50] 태블릿일 경우/[19:12] 모바일일 경우/[20:25] div class=wrap/[21:17] 기본 셋팅 확인/[21:37] div class=sezione_footer sez1/[22:12] 와이드, pc일 경우/[23:09] 모바일일 경우/[23:55] 웹페이지 하단 부분/[25:42] pc 버전 이하 내용

  • 0519분 실제적용 사례 CSS실무코딩 14-1

    책갈피 : [00:01] 웹페이지 확인/[01:00] div class=wrap header role=banner/[01:10] 평상시 적용된 내용/[02:00] 모바일일 경우/[02:57] div class=container/[03:15] 로고/[04:29] 모바일일 경우/[05:29] div class=externalWrap/[06:00] div class=external/[07:15] 첫번째 내용/[08:39] li 확인/[09:11] 평상시 내용/[09:33] 모바일일 경우/[10:28] 아이콘 부분/[10:54] 공통 적용된 li 값 확인/[11:31] 추가된 사항/[12:28] div class=external/[12:41] 기본 적용사항 확인/[12:58] nth-of-type/[13:18] 태블릿일 경우/[15:01] 이미지/[15:43] 존속된 사항 확인/[16:44] 웹페이지 세번째 메뉴/[17:06] p class=header-single-link/[17:52] 태블릿일 경우/[18:21] 모바일일 경우

  • 0623분 실제적용 사례 CSS실무코딩 14-2

    책갈피 : [00:00] 검색바/[00:14] 모바일일 경우/[01:33] li 값 확인/[02:18] 일반 pc, 태블릿일 경우/[02:36] 모바일일 경우/[04:02] 기본적인 input에 대한 선언/[05:56] Button/[06:22] 모바일일 경우/[07:30] input 값 확인/[07:51] 평상시 적용 사항/[08:49] 메뉴/[09:27] ul id=nav role=navigation/[10:57] div class=container/[11:52] 모바일일 경우/[12:26] li 확인/[14:02] li 내부에 이미지가 있을 경우/[15:11] 태블릿일 경우/[15:35] 모바일일 경우/[16:47] fieldset/[18:41] 웹페이지 하단/[19:26] 모바일일 경우 컬러값/[20:12] li 값 확인/[21:26] 백그라운드 이미지/[22:28] 모바일일 경우

  • 0736분 실제적용 사례 CSS실무코딩 15-1

    책갈피 : [00:05] 웹페이지 확인/[00:20] header id=globalheader/[00:55] 평상시 화면일 경우/[01:30] 모바일일 경우/[02:15] div class=content/[03:30] 모바일일 경우/[04:46] 태블릿일 경우/[06:00] ul class=tbar-left/[06:39] li 값 기본 사항/[07:09] 모바일일 경우/[07:41] 변경된 폰트 사이즈 확인/[08:11] 이미지 확인/[08:46] pc, 태블릿일 경우/[09:01] ul id=umenu/[10:22] ul class=tbar-right/[10:46] li class=tb-maps/[11:03] 모바일일 경우/[12:13] a 링크 알아보기/[13:26] 모바일일 경우/[14:24] 태블릿일 경우/[15:28] li class=tb-lang/[16:26] li id=ibutton/[16:40] 평상시 화면일 경우/[17:00] 모바일일 경우/[17:59] 좌표/[18:33] div class=content/[20:52] 로고/[21:21] 일반 pc 일 경우/[22:14] 모바일 전 상황/[23:17] 모바일일 경우/[24:10] nav id=actionnavi/[24:26] 일반 pc 일 경우/[25:26] 모바일일 경우/[25:56] input 확인/[27:45] input type=submit/[29:29] li에 내용이 있을 때/[29:48] 태블릿일 경우/[30:21] 평상시 화면일 경우/[30:47] 모바일일 경우/[31:41] 메뉴/[32:15] nav id=globalnavi class=grid grid-12 first/[33:20] 태블릿일 경우/[34:13] 모바일일 경우/[34:52] ul class=sec-top/[35:42] 태블릿일 경우/[35:59] ul class=mainlinks

  • 0839분 실제적용 사례 CSS실무코딩 15-2

    책갈피 : [00:02] 태블릿일 경우/[00:53] li 태그의 열쇠/[02:52] 모바일일 경우 li 값/[03:56] 두번째 a링크/[04:21] div class=content bm-10px/[04:26] pc 일 경우/[05:01] 태블릿일 경우/[06:17] div class=grid grid-12 first/[07:16] 모바일일 경우/[07:52] div id=slideshow/[08:48] 이미지가 변경됐을 때/[10:56] ul class=link-audience png_bg/[11:46] 작은 사이즈가 됐을때/[12:31] 모바일일 경우/[13:17] 텍스트 사이즈/[15:34] 모바일일 경우/[15:53] li class=btn-request-info/[16:42] 태블릿일 경우/[17:37] 모바일일 경우/[18:04] 간과하지 말아야 할 점/[19:02] 태블릿일 경우 폰트 사이즈/[19:57] 모바일일 경우 폰트 사이즈/[20:59] div class=program-links/[22:23] ul 목록 확인/[23:28] padding값/[24:18] div class=content featured/[25:44] 평상시 화면일 경우/[27:38] 태블릿일 경우/[27:41] 모바일일 경우/[29:51] 웹페이지 하단/[29:58] h1 적용사항 확인/[30:45] 평상시 화면일 경우/[32:06] 모바일일 경우/[32:33] footer/[33:44] div class= grid gird-4 first grid-reset/[34:01] 평상시 화면일 경우/[34:42] 태블릿일 경우/[35:24] div class=grid grid-8 grid-reset/[37:34] 한 줄로 나오게 된 계기/[38:01] 화면에 따른 크기 차이/[38:02] Copyright

  • 0936분 실제적용 사례 CSS실무코딩 16-1

    책갈피 : [00:09] div class=navbar navbar-inverse navbar-fixed-top/[01:34] pc 사이즈일 경우/[02:20] 모바일일 경우/[02:53] 마진값 제거 후 확인/[03:28] div class=centered/[04:15] pc 사이즈일 경우/[05:25] 태블릿일 경우/[06:00] 모바일일 경우/[07:15] div class=navbar-inner/[08:18] 평상시 적용된 사항/[08:39] 모바일일 경우/[09:58] div class=nav-collapse collapse/[10:33] 평상시 적용된 사항/[11:33] ul class=nav/[12:26] 모바일일 경우/[14:41] li 목록 확인/[15:03] 와이드 화면일 경우/[15:35] 여백 확인/[15:56] 태블릿일 경우/[16:55] 모바일일 경우/[17:40] 여백 차이/[18:52] 평상시 css 선언/[19:33] li id=search/[20:45] 태블릿일 경우/[21:33] search가 없어진 이유/[22:26] div class=inline-search/[22:56] 평상시 설정/[23:56] button type=button/[24:41] button type=button/[25:30] section id=logowrap/[26:15] 태블릿 전 사이즈 일 경우/[26:52] 태블릿일 경우/[27:59] 모바일일 경우 이미지 확인/[28:51] 내용 보기/[29:41] nav id=global role=navigation/[30:37] pc일 경우/[31:36] 모바일일 경우/[32:07] tickets& shows/[32:19] 평상시 설정/[32:52] 모바일일 경우/[33:58] 평상시 내용일때 ul 목록/[34:35] 일반 pc 사이즈일 경우

  • 1030분 실제적용 사례 CSS실무코딩 16-2

    책갈피 : [00:04] 모바일 li 값 확인/[00:33] 평상시 a가 있을 경우/[01:13] 이미지/[03:13] css 선언 보기/[04:28] 폰트 사이즈 변경 확인/[04:46] 태블릿일 경우/[05:29] 모바일일 경우/[06:02] 아래 이미지 와이드일 경우/[06:23] 일반 pc 사이즈일 경우/[06:54] 모바일일 경우/[07:47] 화면에 따른 폰트 사이즈 변경 확인/[07:52] pc 화면일 경우/[08:00] 모바일일 경우/[09:19] li 태그/[10:11] 평상시 내용/[11:26] 모바일일 경우/[12:29] Section 확인/[13:06] section class=callout/[15:27] section id=content/[15:45] 와이드일 경우/[16:45] 모바일일 경우/[18:07] 와이드일 경우 기본적인 사항/[18:51] 모바일일 경우 넓이값/[20:40] 두가지 텍스트 유형/[20:51] 모바일일 경우/[22:34] 모바일일 경우 p태그 사이즈 확인/[23:46] aside id=side bar/[23:57] 평상시 사이즈 확인/[25:14] footer/[26:24] 모바일일 경우/[27:03] 메뉴/[27:16] 평상시 내용/[28:25] li 보기/[29:15] 우측 하단 내용

  • 1126분 실제적용 사례 CSS실무코딩 17-1

    책갈피 : [00:08] 웹페이지 확인/[00:44] 이미지/[01:07] div id=branding/[01:37] 일반적인 선언 보기/[02:06] 모바일일 경우/[02:38] 이미지 확인/[03:58] 밑 이미지 css 확인/[04:46] a링크 됐을 경우 로고 확인/[05:46] 평상시 백그라운드 포지션/[06:46] ul id=navigation_pri/[07:00] 평상시 화면일 경우/[08:54] 모바일일 경우/[09:58] li 태그/[10:09] 평상시 화면일 경우/[11:00] 백그라운드 이미지 설정 확인/[12:01] 외부 여백 확인/[12:33] 모바일일 경우 넓이/[13:48] 웹페이지 하단 내용 보기/[14:43] 새 웹페이지 확인/[15:05] div id=page class=sc-home/[15:58] div id=masthead/[16:37] 백그라운드 이미지 선언 확인/[17:22] 웹페이지가 줄어들었을 경우/[18:51] 모바일일 경우 적용사항/[19:55] 해당 css에 h1이 있을경우/[20:14] 로고 확인/[21:18] a링크에 이미지가 있을 경우/[22:21] 로고 추가 설정 부분/[22:52] ul id=nav/[23:06] 평상시 선언 확인/[24:15] 모바일일 경우

  • 1231분 실제적용 사례 CSS실무코딩 17-2

    책갈피 : [00:14] 실제 적용된 사항/[00:56] 처음 이미지 적용 사항/[02:34] ul id=nav/[03:22] border값/[03:42] 화면이 줄었을 경우 li 확인/[05:35] 백그라운드 이미지에 포지션 주기/[06:18] 포지션 이미지 확인/[06:38] 가운데 메뉴/[07:08] div id=promo-nav/[07:12] 모바일일 경우/[08:10] 평상시 사항/[09:41] 평상시 li/[10:26] promo-nav li a 보기/[11:09] 좌,우 두개가 됐을 경우/[11:23] li와 a값 확인/[12:41] s평상시 최소높이/[13:27] div id=primary/[13:48] 평상시 사항/[14:17] 태블릿일 경우/[16:22] 웹페이지 오른쪽 부분/[17:34] 모바일일 경우/[18:50] div class=inner/[20:44] 이미지 확인/[21:10] div id=footer/[22:22] div class=inner/[23:38] 평상시 사항/[23:46] div id=social/[24:10] 내용 확인/[26:15] column-count 확인/[27:10] 평상시 li 내용/[28:00] Copyright/[29:25] 모바일일 경우

  • 1324분 실제적용 사례 CSS실무코딩 18-1

    책갈피 : [00:05] 웹페이지 확인/[00:35] header id=branding/[01:06] 웹페이지 상단 보기/[02:06] min-width 확인/[03:46] 평상시 선언 사항/[04:15] div id=head-inner/[04:46] 와이드 화면일 경우 변경 사항/[06:15] pc일 경우/[07:28] a id=back-home/[07:54] 일반적인 사항일 경우/[08:56] div clss=logo/[09:31] 모바일일 경우/[09:58] 와이드와 일반 pc일 경우/[10:26] 변경 사항 확인/[12:05] 이미지/[13:43] 일반적인 사항/[14:43] 아이콘 소스 보기/[14:58] div id=mini-nav/[15:58] a 링크/[17:14] 주목해야할 부분/[17:48] div id=mini-search/[18:30] 평상시 선언/[19:07] div id=search-container/[19:40] 평상시 선언/[20:18] 변수 확인/[20:37] 와이드 화면일 경우 width 값/[21:44] 메뉴/[23:11] css 설정 확인/[23:52] 메인 부분

  • 1427분 실제적용 사례 CSS실무코딩 18-2

    책갈피 : [00:06] div id=main/[00:45] 외부 여백 확인/[02:26] div id=primary/[04:23] 모바일일 경우/[05:26] div class=inner/[05:30] 와이드일 경우/[05:35] pc와 태블릿일 경우/[07:47] h1에 대한 태그/[08:10] 모바일일 경우/[09:01] 이미지 값 살펴보기/[09:36] div id=social/[11:41] div id=secondary/[12:22] 기본 사항/[14:13] footer/[14:28] 일반적인 사항 보기/[15:42] 사이즈 확인/[16:50] div class=signup/[17:19] 평상시 화면일 경우/[17:28] colophon.signup/[18:55] 기본적인 적용 사항/[19:57] div class=item/[21:00] 일반적인 사항일 경우/[21:21] 화면 줄여졌을 경우/[22:55] ul class=nav/[24:36] colophon.nav li/[25:34] 차이점/[26:04] div class=mission/[26:56] 차이점

  • 1544분 실제적용 사례 CSS실무코딩 19-1

    책갈피 : [00:05] 웹페이지 확인/[00:56] body 알아보기/[01:19] body id=Home class=no-js/[01:59] 팝업 확인/[03:30] ul id=Accessibility/[03:59] 평상시 사이즈, 와이드일 경우/[04:41] 모바일일 경우/[05:00] div id=ToolbarWrapper/[06:15] ul class=left/[07:46] ul class=right/[08:37] 변경 사항/[09:20] 평상시 내용 확인/[10:24] li 값 확인/[11:26] 화면 크기가 줄었을 경우/[12:22] 일반 li 값이 출력되는 이유/[13:05] width 값 해당하는 내용 확인/[13:37] li class=likontakt/[14:24] li class=lirss/[15:03] rss 정의 부분 확인/[16:03] 일반 설정 사항/[17:11] 로고 설정 확인/[18:26] search 대해 알아보기/[18:37] div id=searchform class=clearfix/[19:03] 일반 정의 내용 보기/[19:22] 화면 크기가 줄었을 경우/[20:37] 텍스트 사이즈 확인/[21:41] input type/[22:59] 메뉴/[23:18] ul에 대한 선언 알아보기/[24:56] 화면 크기 변화에 따른 ul 태그 확인/[25:48] 기본 사항 확인/[26:48] 평상시 정의된 a 사항/[27:33] a링크 확인/[28:33] 변경된 li 사항/[29:15] 내부 a링크 확인/[29:56] div id=Aktuellt/[30:18] 와이드 화면일 경우/[31:11] 화면 줄었을 경우 내부 여백 변경 확인/[32:06] 외부 여백 추가 확인/[32:22] p class=ribbon/[33:37] div class=featureimage/[34:37] div class=featureText/[35:52] div id=main/[36:04] 평상시 화면일 경우/[36:37] 모바일일 경우/[37:22] ul id=Breadcrumb/[38:22] h2 class=entry-title/[39:37] div class=entry-meta-wrapper/[40:29] ul의 평상시 설정/[41:30] li 목록 확인/[42:20] 텍스트 선언 확인/[42:45] a링크 확인

  • 1648분 실제적용 사례 CSS실무코딩 19-2

    책갈피 : [00:16] 오른쪽 메뉴 div 확인/[01:39] 하단 메뉴/[02:58] div id=landskapswrapper/[04:07] div id=landskap1/[04:35] div id=landskap2/[06:05] div id=etikettmoln/[06:13] 평상시 화면일 경우/[08:53] Copyright 부분/[09:03] 웹페이지 확인/[09:40] div id=wrap/[09:57] 화면 줄어들었을 경우/[11:23] header role=banner/[11:32] 모바일일 경우/[12:08] 로고 확인/[12:30] div id=logo/[12:35] 평상시 화면일 경우/[13:47] ul class=group/[14:48] 평상시 li 확인/[15:00] 평상시 a링크 확인/[16:16] article/[17:30] article aside/[18:30] 제목글에 h4가 있을 때/[18:34] 평상시 화면일 경우/[19:18] 본문 아래 텍스트 부분/[19:53] 모바일일 경우/[21:06] 웹페이지 아래 부분/[21:46] 모바일일 경우/[22:40] div.mod-main/[23:28] div.mod-alt/[24:22] footer/[24:44] 일반 사항일때/[25:49] 새로운 웹페이지 보기/[26:33] div class=inner/[26:55] 일반적인 설정일 경우/[28:03] 로고/[28:12] 와이드 화면일 경우/[30:42] 로고 뒤 이미지/[32:59] ul.nav/[34:56] ul.nav li/[35:41] li.first a/[36:22] ul.nav li.first a/[37:00] intro 평상시 경우/[38:10] 모바일 화면일 경우/[39:00] 이미지/[39:19] .main/[39:42] 와이드 화면일 경우/[41:02] figure/[43:11] footer/[45:08] margin-left 값 수정/[46:17] 넓이값

  • 1735분 실제적용 사례 CSS실무코딩 20-1

    책갈피 : [00:00] 웹페이지 확인/[00:11] body class=home/[00:46] 일반 body 설정사항 확인/[00:56] css 특이점/[02:45] 태블릿일 경우/[03:05] 태블릿 이상일 경우 해당 이미지/[04:15] 모바일일 경우 해당 이미지/[05:00] 태블릿 이상 사이즈일 경우 기본 내용/[05:43] 네비게이션 태그/[06:15] 현재까지 내용 확인/[07:00] 평상시 컬러값과 폰트 사이즈 확인/[07:15] 모바일일 경우/[07:57] ul class=clearfix/[09:46] li 값 확인/[09:56] 태블릿 이상일 경우/[10:33] 사이트 화면 줄었을 경우/[11:11] 반영 안되는 사항/[12:11] span class=nav-bar clearfix/[12:26] 일반 pc, 와이드일 경우/[13:46] 사이트 화면 줄었을 경우/[15:15] header class=vevent clearfix/[15:24] 일반 pc, 와이드일 경우/[16:03] 모바일일 경우/[17:37] hgroup/[17:56] 일반 pc일 경우/[18:52] 추가적인 일반사항/[19:29] 태블릿일 경우/[20:41] header h1/[21:26] 화면 줄었을 경우 텍스트 사이즈 확인/[22:03] 일반적인 사항일 경우/[23:07] header h2/[23:56] 화면 줄었을 경우/[24:26] 모바일 사이즈일 경우 기본 선언/[25:00] span class=ribbon/[25:29] 와이드 화면일 경우/[26:48] section class=introduction/[27:41] 화면 줄었을 경우 기본 정의사항/[28:26] h2 이미지/[29:18] 일반적인 사항/[30:10] pc나 와이드일 경우/[31:40] introduction img 일반적 사항/[32:22] div class=section/[34:04] 웹사이트 화면에 따른 내부 여백 확인/[35:07] 모바일일 경우

  • 1833분 실제적용 사례 CSS실무코딩 20-2

    책갈피 : [00:33] span clss=we-are-8/[02:15] section class=speakers-list section bleed clearfix/[02:28] 와이드일 경우/[02:55] 웹사이트 화면 줄어들었을 경우/[03:31] 모바일일 경우/[04:30] li 태그 확인/[04:54] 와이드일 경우/[06:07] li 별도 선언 값 확인/[07:21] 두번째 li 확인/[09:26] li 이미지 확인/[10:01] 기본적인 li 값 확인/[10:18] css의 기준점/[10:54] 첫 번째 li 값 확인/[12:06] 화면 줄어들었을 경우 첫번째 li 값 확인/[13:28] 두번째 내용 확인/[14:26] 줄어들었을 경우/[17:03] 흰색 라인 생성/[18:10] 주석 처리 부분 제거/[18:18] 확인/[20:16] div class=social-links section clearfix/[21:07] 화면 줄어들었을 경우/[21:27] li에 대한 차이/[23:03] li class=twitter/[23:28] 포지션 정의 부분/[24:55] 퍼센트 정의 부분/[28:16] 밑 메뉴 부분/[29:40] li에 a가 있는 경우/[30:23] 웹페이지 하단 로고/[30:51] footer small img/[31:36] 팁

  • 1939분 워드프레스와 반응형웹 part1

    책갈피 : [00:06] 워드프레스의 반응형 웹/[00:22] 내용 보기/[01:03] 미디어 스크린일 경우 적용사항/[02:15] pc, 와이드 이하일 경우/[03:07] 전체 내용 페이지 소스 확인/[04:29] body.site/[05:29] 반영된 내용 확인/[06:15] 사이즈 줄었을 경우/[08:50] 메뉴 확인/[09:13] 문제점/[09:35] 메뉴 소스 보기/[10:24] menu-toggle/[11:15] main-navigation ul.nav-menu/[12:37] 버튼 요소 확인/[13:18] 평상시 적용값 확인/[13:52] 테블릿 이하 모바일일 경우/[15:03] 평상시 사항일 경우/[16:00] main-navigation ul.nav-menu/[17:52] 컬러 추가/[18:37] 화면 줄였을 경우 나머지 부분/[19:18] 평상시 사항일 경우/[20:03] widget-area/[21:52] 워드프레스 테마 보기/[22:17] 헤드 부분 보기/[22:48] 화면 사이즈 변경/[23:18] masthead-fixed.site-header/[23:36] site-header/[24:03] 차이점/[25:07] div class=header-main/[26:17] 화면 줄어들었을 경우/[27:03] h1 class/[27:52] 화면 줄어들었을 경우/[28:11] 검색 버튼/[28:45] 화면 줄어들었을 경우/[29:51] 메뉴/[30:37] 메뉴 부분 페이지 소스 보기/[31:11] primary-navigation.nav-menu/[31:25] 화면 줄어들었을 경우/[32:22] 메뉴 단축 버튼/[33:22] menu-toggle/[34:37] menu-toggle:before/[36:15] secondary/[37:19] 와이드 화면일 경우/[38:22] 화면 줄어들었을 경우

  • 2040분 워드프레스와 반응형웹 part2

    책갈피 : [00:04] main-content/[00:14] 왼쪽에 메뉴가 있는 경우/[00:55] 화면 줄어들었을 경우/[01:45] list-view.site-content.hentry/[04:03] 차이 비교/[05:40] site-description/[06:51] 마우스 오버시 메뉴 차이점/[07:34] secondary-navigation a/[07:48] site-navigation li/[08:35] secondary-navigation ul ul/[09:49] 하단 메뉴 부분/[10:31] footer-sidebar.widget/[11:17] 테마 보기/[12:00] 소스 보기/[12:37] 화면 확대 후 보더 확인/[13:10] 평상시 사항일 경우/[13:29] 화면 사이즈 줄였을 경우/[16:09] 링크 부분 소스 보기/[16:33] site-header.home-link/[18:22] site-title/[18:48] 도메인 주소/[19:17] clip/[20:28] menu-toggle/[22:14] 검색 버튼/[23:00] entry-header/[23:20] 태블릿 화면일 경우/[25:31] entry-title/[25:35] 태블릿 화면일 경우/[26:16] 화면 줄어들었을 경우/[27:17] 위젯 차이 확인/[28:37] 반응형 웹 화면 보기/[29:03] body, input,textarea/[30:36] site-title/[31:47] 링크 값/[32:06] site-title a/[33:02] site-description/[34:05] branding searchform/[35:29] access ul/[36:21] 본문 내용/[36:37] 우측 내용/[38:50] supplementary.two.widget-area






본 강의 수강생들의 추가구매가 가장 많은 학과.