1
00:00:00,210 --> 00:00:22,330
좋습니다. 그래서 우리 첫번째 Jay queery 운동을위한 시간입니다.이 작품은 제가 샘플을 위해 샘플 샘플을 몇 개 준비해 놓았습니다. 어떤 클래스는 몇 가지 아이디어를 가지고 있습니다. 그리고 div를 위해 그것을 가져다가 넣을 것입니다. 자신의 나이 HTML 파일과 Cdn을 사용하려는 경우 또는 다운로드하려는 경우 올바르게 수행 할 수 있도록 Jay 쿼리를 올바르게 포함해야합니다.

2
00:00:22,650 --> 00:00:32,040
그리고 나서 제이 퀘리 (Jay Querrey)와 특히 달러 기호를 사용하여 시도하고 스타일을 선택하려면 점을 찍으려고합니다.

3
00:00:32,070 --> 00:00:33,130
그래서 첫 번째 것.

4
00:00:33,270 --> 00:00:36,590
모든 div를 선택하고 보라색 배경을 지정하십시오.

5
00:00:36,870 --> 00:00:43,200
다음은 클래스 하이라이트가있는 div를 선택하고 200 픽셀 너비로 만듭니다.

6
00:00:43,200 --> 00:00:51,930
세 번째는 ID가 세 번째 인 div를 선택하고 주황색 경계선을 지정하고 경계선의 넓이와 스타일을 지정하는 것입니다.

7
00:00:52,110 --> 00:00:58,630
보너스는 첫 번째 div 만 선택하고 글꼴 색상을 분홍색으로 변경하는 것입니다.

8
00:00:58,650 --> 00:01:00,120
그러니 한번 시도 해보세요.

9
00:01:00,120 --> 00:01:01,710
비디오를 게시해야합니다.

10
00:01:01,710 --> 00:01:03,280
새 시대 HTML 파일을 만듭니다.

11
00:01:03,330 --> 00:01:09,660
쿼리를 포함시킨 다음이 코드를 복사하거나 직접 입력하면 네 가지 문제를 해결해야합니다.

12
00:01:09,660 --> 00:01:11,130
동영상을 게시하십시오.

13
00:01:11,130 --> 00:01:21,730
이미 솔루션으로 몇 초 만에 돌아올 것입니다.

14
00:01:21,750 --> 00:01:24,700
먼저이 문제에 대한 빠른 해결책을 생각해 봅시다.

15
00:01:25,050 --> 00:01:29,070
항상 그렇듯이 우리가해야 할 첫 번째 일은 매 시간 파일을 만드는 것입니다.

16
00:01:29,070 --> 00:01:30,220
그래서 나는 새 파일을 가지고있다.

17
00:01:30,240 --> 00:01:48,780
나는 그것을 html로 연습하고 그것을 저장하고 정기적으로 h timl 보일러 플레이트를 추가하고 우리는 제목에서이 J 쿼리 연습을 호출 할 것이고 그 다음에 나는 우리 선발 DML과 I를 추가 할 것이다. 그냥 타이핑하는 대신 그것을 복사 할 것입니다.

18
00:01:49,520 --> 00:01:52,080
네, 네 가지 요소가 있습니다.

19
00:01:52,080 --> 00:01:54,660
이제 Jay Querrey를 추가하겠습니다.

20
00:01:54,780 --> 00:02:00,330
우리가 할 수있는 두 가지 방법이 있다는 것을 기억하십시오. 로컬에 포함시킬 수 있거나 CDN에 연결할 수 있습니다.

21
00:02:00,480 --> 00:02:03,150
그래서 첫 번째와 두 번째를 모두 보여 드리겠습니다.

22
00:02:03,510 --> 00:02:05,710
파일을 복사 할 것입니다.

23
00:02:06,030 --> 00:02:10,430
그래서 나는 단지 명령 V를 명령하기 위해 여기 버전을 수정해야한다.

24
00:02:10,620 --> 00:02:14,350
그래서 저는 Simmo 시대의 운동과 같은 디렉토리에 있습니다.

25
00:02:14,580 --> 00:02:31,000
그리고 나서 여기로 가서 제일 먼저 스크립트 태그 스크립트를 추가 한 다음 소스와 같음을 추가하고 그 점을 정확하게 일치시켜야합니다. Jay 대쉬가 1.4를 가리키는 지 확인해야합니다. 남자.

26
00:02:31,080 --> 00:02:32,110
예.

27
00:02:32,190 --> 00:02:38,230
그래서 Jay queery는 Dot 남자를 위해 1 점을 가리 키기 위해 돌진합니다.

28
00:02:38,390 --> 00:02:45,640
예수님은 그것을 구해서 브라우저에 열어 놓고 작동하는지 알아보기 위해 조금만 시험해 보겠습니다.

29
00:02:46,650 --> 00:02:47,950
파일을 찾은 것 같습니다.

30
00:02:47,970 --> 00:02:56,910
그렇지 않으면 우리에게 오류가 발생하고 달러 기호 div와 같은 것을 시도하고 우리가 얻는 것을 볼 수 있습니다.

31
00:02:57,030 --> 00:02:57,910
그리고 그것은 효과적입니다.

32
00:02:57,900 --> 00:03:00,060
그것은 우리의 4 div를 선택합니다.

33
00:03:00,060 --> 00:03:02,670
A-J 쿼리 CDN도 포함 할 수 있습니다.

34
00:03:03,180 --> 00:03:04,600
그리고 나는 단지 그것에 대해 구글이다.

35
00:03:04,680 --> 00:03:07,510
제이 케르세틴. 그리고 우리 버전을 골라라.

36
00:03:07,980 --> 00:03:09,690
그래서 우리는 3.0을 원하지 않습니다.

37
00:03:09,930 --> 00:03:10,670
나는 그것이 잘 동작 할 것이라고 확신한다.

38
00:03:10,680 --> 00:03:12,940
그러나 그것은 최신 버전이며 여전히 알파입니다.

39
00:03:13,050 --> 00:03:15,070
아마도 버그와 문제가있을 것입니다.

40
00:03:15,150 --> 00:03:28,830
그래서 한 지점을 가리 키려면 4가 가장 안정적인 버전입니다. 그런 다음이 URL을 복사 한 다음 다른 스크립트 태그를 추가하고 둘 다 여기에두고 그냥 댓글을 달고 소스를 재설정하십시오. 잘못된.

41
00:03:28,950 --> 00:03:38,460
그래서 어느 쪽이든 작동합니다. 저는 이미 Cdn을 사용합니다. 우리 모두가 Cdn을 사용하고 있음을 이미 증명했기 때문입니다.

42
00:03:38,490 --> 00:03:42,360
나는 이미이 사실이 단지 다양한 목적을 위해 일했다는 것을 증명했기 때문에.

43
00:03:42,510 --> 00:03:47,180
그래서 우리는 저장하고 다시 새로 고치고 코드가 여전히 작동하는지 다시 확인합니다.

44
00:03:47,460 --> 00:03:49,830
그렇습니다. 달러 기호를 찾는 것이 좋습니다.

45
00:03:49,830 --> 00:03:51,510
그것은 J Qwerty와 연결되어 있습니다.

46
00:03:51,600 --> 00:04:01,330
제가 만들고 싶은 한가지 요점은 우리가 J 큐리를 맨 위를 포함하고 우리가 스크립트에 사용하여 우리가 몸에 적어주는 것입니다.

47
00:04:01,590 --> 00:04:11,120
그리고 우리가하는 일은 그들이 선언 한 순서대로 물건을 기억한다는 것입니다. 그래서 우리는 스크립트 대신에 Arjay 쿼리를 확실히 사용하기를 원합니다.

48
00:04:11,430 --> 00:04:18,620
그래서 우리가 정의 할 필요가있는 스크립트는 코드를 작성하는 곳이며, 우리는 이것을 단지 운동이라고 부를 것입니다.

49
00:04:18,640 --> 00:04:19,720
J s.

50
00:04:19,850 --> 00:04:41,790
그리고 우리는이 파일을 J와 비슷한 위치에 놓을 것이고 우리가 할 수있는 일은 우리의 h tim 파일과 J 쿼리 모두에 연결되어 있는지를 확인하는 아주 간단한 테스트입니다 J 쿼리 메서드를보고 사용할 수 있다면이 작업을 수행 할 것입니다.

51
00:04:41,820 --> 00:04:59,780
J 쿼리가 다른 작업을 수행 할 경우 J 쿼리가 있으면 Jay Querrey가 슬픈 표정을 짓고 저장한다는 쿼리를 알려줍니다.

52
00:05:00,020 --> 00:05:03,540
이제 새로 고침하면 J 쿼리가로드됩니다.

53
00:05:03,760 --> 00:05:05,240
그래서 두 가지 사실을 알 수 있습니다.

54
00:05:05,260 --> 00:05:12,570
이 스크립트는 예수가 연결되어 있고 두 사람이 Jay Querrey 방법을 사용할 수있는 운동을 실행 중입니다.

55
00:05:12,820 --> 00:05:28,260
우리가 이것을 역순으로했다면 제 운동을 포함시킨 후에 제이 쿼리를 넣었습니다 Jay 예 그리고 저장하고 새로 고침을하면 J 쿼리가 정의되지 않았기 때문에 우리가 물건을 배치하는 순서의 중요성을 알 수 있다고 말하는 오류가 발생합니다 에서.

56
00:05:28,510 --> 00:05:37,540
그래서 우리는 항상 우리 코드를 사용하는 스크립트보다 코드에 우선 순위가 높은 라이브러리를 배치하고자합니다.

57
00:05:37,720 --> 00:05:44,020
과제로 돌아가서 우리가해야 할 첫 번째 일은 우리가 이미 한 Jay Querrey를 올바르게 포함시키는 것입니다.

58
00:05:44,020 --> 00:05:48,670
다음으로 모든 div를 선택하고 보라색 배경을 제공해야합니다.

59
00:05:49,000 --> 00:05:55,530
이제 따옴표 대신 달러 기호를 사용하여 모든 div를 선택하겠습니다.

60
00:05:55,690 --> 00:05:58,360
CSSA로 div를 선택하기 만하면됩니다.

61
00:05:58,390 --> 00:06:02,520
그러니까 C S를 점으로 찍으면 우리는 그들을 자주색으로 만들 것입니다.

62
00:06:02,560 --> 00:06:09,230
이 경우 색이나 배경은 자주색이거나 우리 자신의 R.G.를 사용할 수 있습니다. 보라색의 그늘.

63
00:06:09,380 --> 00:06:15,560
RGV로 보라색을 만드는 방법을 기억하지 못하면 R.G.를 연주해야합니다. 조금 더되었다.

64
00:06:15,670 --> 00:06:20,110
그래서 이것이 우리가 구할 수있는 첫 번째 것입니다.

65
00:06:20,530 --> 00:06:22,910
그리고 우리는 네 개의 자주색 배경을 얻습니다.

66
00:06:23,200 --> 00:06:23,770
승인.

67
00:06:23,920 --> 00:06:25,050
그것이 바로 그 것입니다.

68
00:06:25,090 --> 00:06:28,780
모든 div를 선택하고 보라색 배경을 부여합니다.

69
00:06:28,780 --> 00:06:32,360
여기에 약간의 메모 만 추가하고 주석 처리해 드리겠습니다.

70
00:06:32,620 --> 00:06:38,670
다음으로 우리는 클래스를 강조 표시하여 div를 선택하고 200 픽셀의 너비로 만듭니다.

71
00:06:38,990 --> 00:06:47,390
따라서 매우 유사하게 작동하지만 강조 할 클래스와 div를 선택하려면 다시 달러 기호를 사용해야합니다.

72
00:06:47,950 --> 00:07:02,770
그리고 div가 아니라 도트 하이라이트를 사용하고 C S를 사용하면 200 개의 피크가됩니다.

73
00:07:02,870 --> 00:07:07,660
기술적으로 강조 표시가있는 항목을 선택한다는 것은 주목할 가치가 있습니다.

74
00:07:07,660 --> 00:07:18,470
명시 적으로 강조하고 하이라이트 클래스를 가진 div 만 말할 경우 앵커 태그를 가질 수도 있고 해당 클래스를 가진 단락을 사용할 수도 있습니다.이 선택기를 작성합니다.

75
00:07:18,670 --> 00:07:22,290
그리고 이것은 하이라이트의 클래스와 모든 divs 말한다 C S S입니다.

76
00:07:22,390 --> 00:07:24,370
그러나이 경우에는 차이가 있습니다.

77
00:07:24,380 --> 00:07:35,260
따라서 새로 고침을 한 200 픽셀과이 두 div가 두 번째 및 네 번째 div의 강조 표시 클래스를 가지고 있고 200 픽셀이있는 것을 볼 수 있습니다.

78
00:07:35,890 --> 00:07:41,100
OK는 세 번째 개념을 가진 div를 선택하는 것입니다.

79
00:07:41,460 --> 00:07:51,850
그리고 주황색 경계선을 부여하여 그 ID 달러 기호로 div를 선택하고 도트 대신에 우리는 소프에게 우리를 필요로합니다.

80
00:07:52,300 --> 00:07:59,060
그리고 나서 SS가 주문한 ID의 이름은 우리에게 달린 것입니다.

81
00:07:59,080 --> 00:08:00,680
내가 말했듯이 색은 주황색이었다.

82
00:08:00,870 --> 00:08:11,140
이제 두 개의 픽셀 솔리드 오렌지 경계를 만들고 저장하고 새로 고치십시오. 이제 오렌지 경계선이 생깁니다.

83
00:08:11,190 --> 00:08:14,680
스크린 캐스트에서 더 잘 보이도록 조금 더 크게 만들 것입니다.

84
00:08:14,680 --> 00:08:15,280
우리는 거기에 갈.

85
00:08:15,500 --> 00:08:20,360
그리고 그것은 단어의 ID를 가진 세 번째 div 주위에 있습니다.

86
00:08:20,650 --> 00:08:32,380
따라서 보너스였던 마지막 도전 과제는 첫 번째 div 만 선택하고 CSSA 의사 선택기를 사용하는 첫 번째 div를 선택하는 방식으로 글꼴 색상을 분홍색으로 변경하는 것입니다.

87
00:08:32,380 --> 00:08:42,710
먼저 CSSA 선택기 비디오에서 익숙해야하는 대시 형식의 so div 콜론 첫 번째 대시를 입력하십시오.

88
00:08:42,910 --> 00:08:55,730
그리고 나서 우리는 핑크색을 SS 컬러 핑크색으로 만들고 저장하고 새로 고침하면 분홍색을 볼 수 있습니다.

89
00:08:55,730 --> 00:09:05,350
우리가 가지고있는 다른 옵션은 사실 콜론 (Colan)과 J 쿼리 단축키가 내장되어 있으며 잘 작동합니다.

90
00:09:05,380 --> 00:09:19,970
흥미로운 점은 콜론을 먼저 사용하는 것이 유형의 첫 번째 유형보다 약간 느리다는 것입니다. 왜냐하면 먼저 유형이 CSSA 선택기이고 첫 번째는 J 쿼리 단축키라는 평가가 필요하기 때문입니다.

91
00:09:20,060 --> 00:09:23,590
그래서 그것은 네이티브 C가 아닙니다. Ss 그것은 단지 약간 더 느립니다.

92
00:09:23,770 --> 00:09:25,540
그래서 저는 먼저 타입을 사용할 것입니다.

93
00:09:25,880 --> 00:09:28,870
좋습니다. 다음 몇 개의 비디오에서이 연습을 위해 사용하겠습니다.