좋습니다. 그래서 우리 첫번째 Jay queery 운동을위한 시간입니다.이 작품은 제가 샘플을 위해 샘플 샘플을 몇 개 준비해 놓았습니다. 어떤 클래스는 몇 가지 아이디어를 가지고 있습니다. 그리고 div를 위해 그것을 가져다가 넣을 것입니다. 자신의 나이 HTML 파일과 Cdn을 사용하려는 경우 또는 다운로드하려는 경우 올바르게 수행 할 수 있도록 Jay 쿼리를 올바르게 포함해야합니다.
그리고 나서 제이 퀘리 (Jay Querrey)와 특히 달러 기호를 사용하여 시도하고 스타일을 선택하려면 점을 찍으려고합니다.
그래서 첫 번째 것.
모든 div를 선택하고 보라색 배경을 지정하십시오.
다음은 클래스 하이라이트가있는 div를 선택하고 200 픽셀 너비로 만듭니다.
세 번째는 ID가 세 번째 인 div를 선택하고 주황색 경계선을 지정하고 경계선의 넓이와 스타일을 지정하는 것입니다.
보너스는 첫 번째 div 만 선택하고 글꼴 색상을 분홍색으로 변경하는 것입니다.
그러니 한번 시도 해보세요.
비디오를 게시해야합니다.
새 시대 HTML 파일을 만듭니다.
쿼리를 포함시킨 다음이 코드를 복사하거나 직접 입력하면 네 가지 문제를 해결해야합니다.
동영상을 게시하십시오.
이미 솔루션으로 몇 초 만에 돌아올 것입니다.
먼저이 문제에 대한 빠른 해결책을 생각해 봅시다.
항상 그렇듯이 우리가해야 할 첫 번째 일은 매 시간 파일을 만드는 것입니다.
그래서 나는 새 파일을 가지고있다.
나는 그것을 html로 연습하고 그것을 저장하고 정기적으로 h timl 보일러 플레이트를 추가하고 우리는 제목에서이 J 쿼리 연습을 호출 할 것이고 그 다음에 나는 우리 선발 DML과 I를 추가 할 것이다. 그냥 타이핑하는 대신 그것을 복사 할 것입니다.
네, 네 가지 요소가 있습니다.
이제 Jay Querrey를 추가하겠습니다.
우리가 할 수있는 두 가지 방법이 있다는 것을 기억하십시오. 로컬에 포함시킬 수 있거나 CDN에 연결할 수 있습니다.
그래서 첫 번째와 두 번째를 모두 보여 드리겠습니다.
파일을 복사 할 것입니다.
그래서 나는 단지 명령 V를 명령하기 위해 여기 버전을 수정해야한다.
그래서 저는 Simmo 시대의 운동과 같은 디렉토리에 있습니다.
그리고 나서 여기로 가서 제일 먼저 스크립트 태그 스크립트를 추가 한 다음 소스와 같음을 추가하고 그 점을 정확하게 일치시켜야합니다. Jay 대쉬가 1.4를 가리키는 지 확인해야합니다. 남자.
예.
그래서 Jay queery는 Dot 남자를 위해 1 점을 가리 키기 위해 돌진합니다.
예수님은 그것을 구해서 브라우저에 열어 놓고 작동하는지 알아보기 위해 조금만 시험해 보겠습니다.
파일을 찾은 것 같습니다.
그렇지 않으면 우리에게 오류가 발생하고 달러 기호 div와 같은 것을 시도하고 우리가 얻는 것을 볼 수 있습니다.
그리고 그것은 효과적입니다.
그것은 우리의 4 div를 선택합니다.
A-J 쿼리 CDN도 포함 할 수 있습니다.
그리고 나는 단지 그것에 대해 구글이다.
제이 케르세틴. 그리고 우리 버전을 골라라.
그래서 우리는 3.0을 원하지 않습니다.
나는 그것이 잘 동작 할 것이라고 확신한다.
그러나 그것은 최신 버전이며 여전히 알파입니다.
아마도 버그와 문제가있을 것입니다.
그래서 한 지점을 가리 키려면 4가 가장 안정적인 버전입니다. 그런 다음이 URL을 복사 한 다음 다른 스크립트 태그를 추가하고 둘 다 여기에두고 그냥 댓글을 달고 소스를 재설정하십시오. 잘못된.
그래서 어느 쪽이든 작동합니다. 저는 이미 Cdn을 사용합니다. 우리 모두가 Cdn을 사용하고 있음을 이미 증명했기 때문입니다.
나는 이미이 사실이 단지 다양한 목적을 위해 일했다는 것을 증명했기 때문에.
그래서 우리는 저장하고 다시 새로 고치고 코드가 여전히 작동하는지 다시 확인합니다.
그렇습니다. 달러 기호를 찾는 것이 좋습니다.
그것은 J Qwerty와 연결되어 있습니다.
제가 만들고 싶은 한가지 요점은 우리가 J 큐리를 맨 위를 포함하고 우리가 스크립트에 사용하여 우리가 몸에 적어주는 것입니다.
그리고 우리가하는 일은 그들이 선언 한 순서대로 물건을 기억한다는 것입니다. 그래서 우리는 스크립트 대신에 Arjay 쿼리를 확실히 사용하기를 원합니다.
그래서 우리가 정의 할 필요가있는 스크립트는 코드를 작성하는 곳이며, 우리는 이것을 단지 운동이라고 부를 것입니다.
J s.
그리고 우리는이 파일을 J와 비슷한 위치에 놓을 것이고 우리가 할 수있는 일은 우리의 h tim 파일과 J 쿼리 모두에 연결되어 있는지를 확인하는 아주 간단한 테스트입니다 J 쿼리 메서드를보고 사용할 수 있다면이 작업을 수행 할 것입니다.
J 쿼리가 다른 작업을 수행 할 경우 J 쿼리가 있으면 Jay Querrey가 슬픈 표정을 짓고 저장한다는 쿼리를 알려줍니다.
이제 새로 고침하면 J 쿼리가로드됩니다.
그래서 두 가지 사실을 알 수 있습니다.
이 스크립트는 예수가 연결되어 있고 두 사람이 Jay Querrey 방법을 사용할 수있는 운동을 실행 중입니다.
우리가 이것을 역순으로했다면 제 운동을 포함시킨 후에 제이 쿼리를 넣었습니다 Jay 예 그리고 저장하고 새로 고침을하면 J 쿼리가 정의되지 않았기 때문에 우리가 물건을 배치하는 순서의 중요성을 알 수 있다고 말하는 오류가 발생합니다 에서.
그래서 우리는 항상 우리 코드를 사용하는 스크립트보다 코드에 우선 순위가 높은 라이브러리를 배치하고자합니다.
과제로 돌아가서 우리가해야 할 첫 번째 일은 우리가 이미 한 Jay Querrey를 올바르게 포함시키는 것입니다.
다음으로 모든 div를 선택하고 보라색 배경을 제공해야합니다.
이제 따옴표 대신 달러 기호를 사용하여 모든 div를 선택하겠습니다.
CSSA로 div를 선택하기 만하면됩니다.
그러니까 C S를 점으로 찍으면 우리는 그들을 자주색으로 만들 것입니다.
이 경우 색이나 배경은 자주색이거나 우리 자신의 R.G.를 사용할 수 있습니다. 보라색의 그늘.
RGV로 보라색을 만드는 방법을 기억하지 못하면 R.G.를 연주해야합니다. 조금 더되었다.
그래서 이것이 우리가 구할 수있는 첫 번째 것입니다.
그리고 우리는 네 개의 자주색 배경을 얻습니다.
승인.
그것이 바로 그 것입니다.
모든 div를 선택하고 보라색 배경을 부여합니다.
여기에 약간의 메모 만 추가하고 주석 처리해 드리겠습니다.
다음으로 우리는 클래스를 강조 표시하여 div를 선택하고 200 픽셀의 너비로 만듭니다.
따라서 매우 유사하게 작동하지만 강조 할 클래스와 div를 선택하려면 다시 달러 기호를 사용해야합니다.
그리고 div가 아니라 도트 하이라이트를 사용하고 C S를 사용하면 200 개의 피크가됩니다.
기술적으로 강조 표시가있는 항목을 선택한다는 것은 주목할 가치가 있습니다.
명시 적으로 강조하고 하이라이트 클래스를 가진 div 만 말할 경우 앵커 태그를 가질 수도 있고 해당 클래스를 가진 단락을 사용할 수도 있습니다.이 선택기를 작성합니다.
그리고 이것은 하이라이트의 클래스와 모든 divs 말한다 C S S입니다.
그러나이 경우에는 차이가 있습니다.
따라서 새로 고침을 한 200 픽셀과이 두 div가 두 번째 및 네 번째 div의 강조 표시 클래스를 가지고 있고 200 픽셀이있는 것을 볼 수 있습니다.
OK는 세 번째 개념을 가진 div를 선택하는 것입니다.
그리고 주황색 경계선을 부여하여 그 ID 달러 기호로 div를 선택하고 도트 대신에 우리는 소프에게 우리를 필요로합니다.
그리고 나서 SS가 주문한 ID의 이름은 우리에게 달린 것입니다.
내가 말했듯이 색은 주황색이었다.
이제 두 개의 픽셀 솔리드 오렌지 경계를 만들고 저장하고 새로 고치십시오. 이제 오렌지 경계선이 생깁니다.
스크린 캐스트에서 더 잘 보이도록 조금 더 크게 만들 것입니다.
우리는 거기에 갈.
그리고 그것은 단어의 ID를 가진 세 번째 div 주위에 있습니다.
따라서 보너스였던 마지막 도전 과제는 첫 번째 div 만 선택하고 CSSA 의사 선택기를 사용하는 첫 번째 div를 선택하는 방식으로 글꼴 색상을 분홍색으로 변경하는 것입니다.
먼저 CSSA 선택기 비디오에서 익숙해야하는 대시 형식의 so div 콜론 첫 번째 대시를 입력하십시오.
그리고 나서 우리는 핑크색을 SS 컬러 핑크색으로 만들고 저장하고 새로 고침하면 분홍색을 볼 수 있습니다.
우리가 가지고있는 다른 옵션은 사실 콜론 (Colan)과 J 쿼리 단축키가 내장되어 있으며 잘 작동합니다.
흥미로운 점은 콜론을 먼저 사용하는 것이 유형의 첫 번째 유형보다 약간 느리다는 것입니다. 왜냐하면 먼저 유형이 CSSA 선택기이고 첫 번째는 J 쿼리 단축키라는 평가가 필요하기 때문입니다.
그래서 그것은 네이티브 C가 아닙니다. Ss 그것은 단지 약간 더 느립니다.
그래서 저는 먼저 타입을 사용할 것입니다.
좋습니다. 다음 몇 개의 비디오에서이 연습을 위해 사용하겠습니다.