승인.
그래서이 비디오에서 우리는이 tic tac toe 보드 연습을 처음부터 다시 만들 것입니다.
그래서 우리는 처음부터 빈 파일을 가지고 시작하려고합니다.
HVM이 보일러 플레이트에 추가 할 수있는 보드를 Coppermine합니다.
그냥 T T T 보드라고 부르며이 작업이 메모리를 조깅하는 방식으로 작동합니다.
그것은 테이블입니다.
이 모든 것이 하나의 테이블입니다.
3 행 1 2, 3이 있고 각 행에는 3 개의 Tweedy가 있습니다.
그래서 우리는 3 x 3 보드로 끝납니다.
그리고 우리가 할 일은 왼쪽과 오른쪽 경계선을 돌릴 세 개의 TV에 들어가는 것입니다. 그리고이 세 개의 TV에서 위아래 경계선을 돌릴 것입니다.
그래서 우리는 테이블과 3 티어로 시작해야합니다.
그리고 저는 실제로 가서 3 개의 왕궁을 할 것이고, 첫 번째 왕국을 할 것입니다.
그래서 우리는 세 개의 TV를 얻은 다음 다시 한 번 그 TV를 복제하려고합니다.
이제 우리는 각각 3 개의 요소가있는 3 개의 행과 3 개의 TV가 있습니다.
그래서 우리는 그것을 구할 것이고 브라우저에서 이것을 열면 우리가 볼 수없는 것을 알게 될 것입니다.
그 이유는 우리 테이블이 있어도 우리 테이블에는 아무것도없는 것이기 때문입니다.
그리고 빈 테이블을 가지고 실제로 이것이 존재하는 것을 여전히 볼 수 있기 때문에 적용된 스타일이 없습니다.
이 테이블에는 데이터가 없습니다.
이 예에서는 여기가 테이블 일 뿐이며 스타일이 적용됩니다.
그래서 그것은 국경을 가지고 있습니다.
그래서 우리는 그렇게해야합니다.
이제는 스타일을 추가해 보도록하겠습니다. 이번에는 스타일 태그로 해보겠습니다.
장기적으로는 좋은 생각이 아니지만 여기서 쉽게 시청할 수 있도록 솔루션 비디오를 제공하므로 파일 사이를 뒤집어보고 내가 한 곳에서 무엇을 할 것인지 혼란스러워 할 필요가 없습니다. 여기 스타일 태그의 상단에 파일.
그래서 제가 할 첫 번째 일은 T를 선택하고 넓이를주는 것입니다. 왜냐하면 지금 우리가 TT를 검사한다면 기본적으로 전혀 존재하지 않는다는 것을 알 수 있기 때문입니다.
그것들은 2 x 2 픽셀입니다.
그래서 그들은 실제로 정말로 작습니다. 왜냐하면 거기에는 아무것도 없기 때문에 우리는 그들에게 높이 또는 높이를 할당하지 않았기 때문입니다.
그래서 내가하고 싶은 일은 너비를주고 100 픽셀부터 시작해서 높이를 위해 똑같은 일을 할 것이고 우리는 저장하고 새로 고침을하고 여전히 아무것도 보지 못합니다.
그리고 우리는 그들에게 아무것도 표시하지 않았기 때문입니다.
그러나 우리가 가서 지금 검사하면 각 Tedy가 100 x 100 픽셀의 정사각형임을 알 수 있습니다.
자, 이제 그곳에 있다는 것을 알 수 있도록 배경을 제공하십시오.
backgrounders 분홍색 저장하십시오.
이제 우리위원회의 시작을 알 수 있습니다.
그래서 저는 실제로 배경 색상을 취소 할 것입니다.
타일이 있다는 것을 보여주고 싶었습니다.
우리는 TV가 있습니다.
이제 우리가해야 할 일은 국경을 선택적으로 켜는 방법을 찾는 것입니다.
그래서 우리는이 세 가지 요소들에 착수 할 것입니다.
왼쪽과 오른쪽 경계선을 켜기를 원합니다.
그래서 내가 그 페이지를 새로 고침하면.
하지만 여기서부터 시작하여 왼쪽과 오른쪽으로 4 분의 1을주는 것으로 시작하겠습니다.
그래서 나는 갈 것이고 그것은 첫 번째 TR 대신에 두 번째 TD입니다.
저는 이것을 클래스로 만들려고합니다. 저는이 클래스를 수직이라고 부르겠습니다.이 3 개의 클래스를 수직이라고 부르며, 왼쪽과 오른쪽 경계 만 얻도록하겠습니다.
따라서 클래스는 수직과 같습니다.
그리고 나서 우리는 수직을 선택하고 왼쪽 테두리를주고 지금은 한 픽셀을 검은 색으로 만들고 테두리를 위해 똑같은 작업을 해봅니다.
권리.
그리고 우리가 저장하고 우리가 신선하다면 우리는 첫 번째 칸이 완성되었음을 알게 될 것입니다.
이제 우리는 그 아래에있는 TV와 그 아래에있는 TV를 추가해야합니다.
그래서 그것을 한 번 이상 사용하기 때문에 수업을 만들었습니다.
따라서 이것을 ID로 만든 다음이 요소에 대한 다른 ID와이 ID에 대한 또 다른 ID를 수행하는 것보다 ID 중간과 그 다음에 ID 중간 하단 또는 그와 비슷한 것을 할 수있었습니다.
그럼 나는 거기에 공간을 가질 수 있지만 그런 것입니다.
Thats는 실제로 좋은 생각이 아닙니다.
우리는 여러개의 ID를 갖고 싶지 않습니다. 그래서 저는 그것을 단지 클래스에 제공 할 것이고 클래스는 수직이 될 것입니다.
그래서 임에도 이걸 줄거야.
이것은 바로 아래에있는 우리의 중간 요소입니다.
그리고 그 아래에있는 다른 하나.
그래서 이들 3 명은 이제 수직 계급을 갖게되고 3 수직선을 얻을 수 있습니다.
이제 수평선에서 같은 과정을 반복하면됩니다.
여기이 요소가 필요합니다.
이 여기와 여기 하나는 경계선 상단과 경계선 아래에 있습니다.
이번에는 클래스부터 시작하여 변경 경계선을 경계선 상단과 경계선 아래로 놓은 다음 수평선을 복사하고 밑줄을 긋고이 수평 클래스에 올바른 요소로 서명하는 것뿐입니다.
그래서 우리가 원했던 것들이 바로 여기에 있습니다. 그래서 이것이 첫 번째 T가 될 것입니다.
두 번째 TR에
그래서 저는 앞으로 나아가서 그렇게 할 것입니다.
클래스가 같거나 TL에 있으며 복사합니다.
그러면 우리는이 가운데 하나에서 이것을 원합니다. 우리는 이미 우리가 클래스를 가지고 있다는 것을 보게 될 것입니다. 우리는 하나 이상의 클래스를 가지고 있기 전에 이것을 실제로 보지 못했습니다.
정말 쉽습니다.
우리가하는 일은 공간을 추가하는 것뿐입니다.
그래서 이것은 수직 수평이라는 하나의 클래스가 아닙니다.
그것은 두 수직이고 또한 수평이다.
그리고 나서 우리는이 마지막 CD와 똑같은 일을 할 것입니다.이 CD가 여기에 있습니다. 그리고 우리가 저장하고 페이지를 새로 고치면 우리는 완성 된 tic tac toe 보드를 갖게됩니다.
그래서 여기서 마지막으로하고 싶은 것은 중심에 놓 이도록 실제로 옮기는 것입니다. 실제로는 정말 쉽습니다.
그것은 우리의 테이블에서 성공의 한 라인 일뿐입니다.
우리는 주문에 여유를두고 거기에 간다.
그 마진은 자동으로 계산됩니다.
내가 스크롤 할 때 볼 수 있습니다.
내 말은 마진이 증가하고 감소하는 창 크기를 조정할 때 가장 중요한 점은 틱택 막 발가락이 그렇게 할 수 있다고 말한 것입니다.
그러나이 요소 Phi가 검사되었음을 알 수 있습니다.
그럼 당신은 그것을 조사하지 않고서도 그것이 측면에 있다는 것을 알 수 있습니다.
따라서 중간에 들어가기를 원한다면 요소는 화면 전체에서 실제로 사용됩니다.
이 파란색은 여기에서 볼 수 있습니다.
그래서 저는 텍스트를 가운데에 맞출 수 있습니다. 그러면 H-1이 실제로 중간에 있다는 효과가 생깁니다.
그래서 저는 H-1 텍스트 정렬 센터와 저장합니다.