페이지 템플릿 코드. 넓은 프레임. HTML5의 선택적 태그
"HTML 페이지를 만드는 방법" 단원은 가장 단순한 웹 페이지의 레이아웃을 다룹니다. HTML 파일을 올바르게 저장하고 브라우저에서 HTML 페이지를 올바르게 표시하는 데 필요한 인코딩을 설정하고 웹 페이지에 텍스트, 목록 및 이미지를 배치하는 방법을 배웁니다.
이 단원을 학습한 후 그림 1과 같이 첫 번째 웹 페이지를 만드는 방법을 이미 배우게 됩니다.
그림 1
1. html 문서의 구조
html 파일은 확장자가 .htm또는 .html.
일반적으로 태그는 짝을 이룹니다: 시작 및 종료 태그. 초기의 -<>, 최종 , 예를 들어
그리고
쌍 태그라고도 합니다. 컨테이너 .
일부 태그에는 필수 쌍 태그가 없으며 이러한 태그를 호출합니다. 하나의
. 이러한 태그는 닫는 꺾쇠 괄호 앞에 오른쪽 슬래시를 작성하여 닫습니다. 예를 들어
html 문서의 구조는 다음과 같습니다(그림 2).
그림 2
그림 2의 목록에 대한 설명
첫 번째 줄에서 DOCTYPE 구조는 웹 페이지 레이아웃 표준 중 하나를 의미합니다.
태그 사이
그리고
헤더를 포함합니다. 그것은 디자인을 포함합니다
그림 3
녹음 문자가 브라우저에 올바르게 표시되도록 하는 키릴 문자 인코딩을 의미합니다. 인코딩을 지정하지 않으면 글꼴이 다음과 같이 표시되는 경우가 있습니다(그림 4).
그림 4
인코딩 삽입 후 같은 페이지(그림 5)
그림 5
참고: 인코딩 대신 문자셋="windows-1251"코딩을 사용할 수 있습니다 문자셋=" UTF -8" , 세계에 존재하는 모든 기호가 있기 때문에 다국어 사이트를 만들 수 있습니다. 이 경우, 메모장++ 레이아웃 및 저장 전에 필요HTML- 상단 메뉴에서 파일 선택 인코딩 - 다음으로 인코딩 UTF -8 없음 BOM (BOM 없는 UTF-8)
이 정보는 첫 번째 문서를 작성하기에 충분합니다.
연습 1
1. 폴더를 만들고 이름을 지정합니다. 나의집. 모든 폴더 및 파일의 이름은 라틴 소문자로 작성해야 하며, 러시아 이름은 사용할 수 없습니다.. 이름을 짧고 의미 있게 유지하십시오.
메모장에 웹 페이지 코드를 작성합니다. Windows와 함께 제공되는 메모장이 아니라 Notepad ++와 같은 "고급" 메모장을 사용하는 것이 좋습니다. 분포 메모장++폴더에 있습니다 CD/배포.
2. 메모장++를 엽니다. 항목의 메뉴에서 ANSI 인코딩이 설정되어 있는지 확인하십시오. 인코딩, 위치 설정 ANSI로 인코딩.
3. 그림 2의 목록에 있는 코드를 Notepad++에 입력합니다.
그림 2의 목록에 있는 코드는 앞으로 우리가 html 문서의 구조를 입력하지 않도록 템플릿 역할을 할 것입니다. 여기에서 DOCTYPE 구성을 복사합니다(기억하고 기억할 필요 없음).
4. 파일을 이름으로 저장 템플릿.html폴더에 우리집, 필드에 있는 동안 파일 형식설치하다 모든 유형(그림 6) 그렇지 않으면 나중에 웹 페이지가 브라우저에서 열리지 않습니다.
그림 6
5. 저장 후 실행 무늬. HTML더블 클릭. 결과적으로 파일은 다음과 같이 표시됩니다(그림 7).
그림 7
위 그림과 같이 결과가 나오지 않는다면 코드에 오류가 있을 가능성이 큽니다. 하나의 잘못된 문자로 충분하며 웹 페이지가 올바르게 표시되지 않습니다. 그림 2의 목록에서 코드를 다시 확인하십시오.
6. 폴더 내부 우리집폴더 만들기 공공의_ HTML. 이 이름은 일반적으로 실제 호스팅에 있을 때 사이트가 저장되는 폴더입니다(이 폴더는 www라고도 함).
7. 파일 저장 무늬. HTML폴더에 공공의_ HTML새로운 이름으로 기본. HTML.
8. 폴더에서 CD/ html_css_1파일 열기 text_main.txt Notepad++에서 이름으로 저장된 파일을 엽니다. 기본. HTML
9. 파일에서 모든 텍스트 복사 text_main.txt그리고 파일에 붙여넣기 기본. HTML"웹 페이지 콘텐츠"라는 문구 대신. 인 태그
10. 변경 사항 저장 및 파일 보기 기본. HTML브라우저에서. 형식이 지정되지 않은 텍스트가 표시됩니다. 소스 텍스트에 있는 줄 바꿈도 브라우저에서는 그렇지 않습니다(그림 8).
그림 8
2. 포맷편물-페이지 태그됨HTML
이 자습서인 HTML 페이지를 만드는 방법에서는 웹 페이지를 표시하는 데 사용되는 기본 태그를 다룹니다.
태그는 웹 페이지의 텍스트 형식을 지정하는 데 사용됩니다. 더 자세한 태그 목록은 폴더에서 찾을 수 있습니다. CD/예배 규칙서HTML디렉토리에서 html401_en.chm(상단 메뉴 항목에서 강요).
몇 가지 태그를 살펴보겠습니다.
강요 시간 1, 시간 2, 시간 3, 시간 4, 시간 5, 시간 6
문서의 본문 구성은 요소 내에서 수행됩니다. < 몸> h1, h2, h3, h4, h5, h6 요소로 설정된 제목의 도움으로.
제목 요소는 쌍을 이루므로 여는 부분이 있어야 합니다. < 시간1> 그리고 닫기 시간1> 태그.
HTML에는 h1(최상위), h2, h3, h4, h5 및 h6(최하위)의 6가지 제목 수준이 있습니다. 제목 요소의 기능은 텍스트 편집기의 일반적인 제목 스타일과 유사합니다.
이 6개 태그의 동작은 아래 그림에 나와 있습니다. 한 장의 사진에서 원천(그림 9), 다른 하나는 브라우저의 보기입니다(그림 10).
그림 9
그림 10
텍스트를 단락으로 나누기
꼬리표 < 피> 단락의 시작을 설정하고 단락 위에 공백을 삽입합니다. 이 단락을 이전 단락과 구분하기 위한 들여쓰기입니다.
강제 줄 바꿈
꼬리표
단락 텍스트의 나머지 부분을 다음 줄로 줄 바꿈할 수 있습니다. 짝이 없는 태그이며 단락 태그와 달리 줄 간격을 늘리지 않습니다.
연습 2
1. "건축 디자인 카탈로그"라는 제목을 태그로 서식 지정
그리고
.2. 태그를 사용하여 "미래의 집을 위한 프로젝트"라는 제목의 서식을 지정합니다.
그리고
.3. 태그를 사용하여 "집 디자인" 및 "집 면적" 제목의 서식을 지정합니다.
그리고
.4. 태그를 이용하여 본문을 문단으로 나누기
처음 두 단락 내에서 태그를 사용하십시오.
줄을 끊기 위해. 결과적으로 코드는 다음과 같아야 합니다(그림 11).
5. 브라우저에서 결과를 봅니다.
그림 11
글머리 기호 및 번호 매기기 목록
HTML 도구를 사용하여 번호가 매겨진(숫자 및 알파벳) 목록과 다른 유형마커.
꼬리표 < 울>…울> 글머리 기호 목록을 생성합니다.
꼬리표 < 올>…올> 번호가 매겨진 목록을 생성합니다.
다음과 같이 별도의 목록 요소
- , 뿐만 아니라
- 그림 13에 표시된 코드를 새 파일에 구현합니다.
- 파일을 폴더에 저장 우리집이름 아래 목록_ 블로즈. HTML. 그림의 결과. 13
- 순수한;
- 상대적인.
- folder_2 폴더를 입력하고,
- 그런 다음 folder_1 폴더를 입력하십시오.
- 그런 다음 이미지를 첨부합니다.
- 종료 폴더 folder_1,
- 종료 폴더 folder_2,
- 이미지를 첨부합니다.
- 종료 폴더 folder_1,
- 종료 폴더 folder_2,
- folder_3 폴더로 이동합니다.
- folder_4 폴더로 이동합니다.
- 이미지 첨부 pic.jpg
- 종료 폴더 folder_1,
- 종료 폴더 folder_2,
- 종료 폴더 folder_3,
- folder_4 폴더를 입력하고,
- 이미지 pic.jpg를 첨부합니다.
- 템플릿.html
- main.html
- list_vlozh.html
- 폴더 안에우리집폴더가 있어야 합니다공공의_ HTML미래 사이트의 파일로
- 상대 주소 지정에 대한 7가지 예와 제어로 2가지 예 실용적인 작업 14
- 키워드 및 페이지 설명
- 다른 파일(*.css 및 *.js)에 대한 링크.
- 태그로 형성 <
리>
.
연습 3
1. "하우스 프로젝트" 제목 아래에 번호가 매겨진 목록을 만듭니다.
2. House Areas 제목 아래 글머리 기호 목록을 만듭니다. 코드는 다음과 같습니다(그림 12).
그림 12
3. 브라우저에서 페이지를 봅니다.
목록은 다른 마커를 사용하여 서로 중첩될 수 있습니다.
중첩 목록의 예는 그림에 나와 있습니다. 13
연습 4
그림 13. 중첩 목록 예
글꼴 스타일
꼬리표 … - 텍스트를 굵게 표시할 수 있습니다.
꼬리표 … - 텍스트를 이탤릭체로 표시할 수 있습니다.
꼬리표 … - 밑줄이 그어진 텍스트를 표시합니다.
예를 들어:
이 경우 텍스트가 표시됩니다. 굵은 기울임꼴 그러나 밑줄이 그어져 있지 않습니다.
이 경우 텍스트가 작성됩니다. 굵은 밑줄 이탤릭체 .
아래첨자와 위첨자
꼬리표 < 보결> 그리고 보결> 텍스트를 일반 텍스트 아래 반 줄 아래에 놓을 수 있습니다.
꼬리표 < 저녁을 먹다> 그리고 저녁을 먹다> 텍스트를 일반 텍스트보다 반 줄 위로 올릴 수 있습니다. 이 태그 사이의 텍스트는 일반 텍스트보다 작은 글꼴로 표시됩니다.
연습 5
1. 첫 번째 단락에서 myhouse.ru라는 이름을 굵게 표시합니다(그림 14).
그림 14
2. 두 번째 단락에서 "프로젝트의 95% 이상" 문구에 밑줄이 그어진 이탤릭체로 서식을 지정합니다(그림 15).
그림 15
3. 제곱미터가 사용되는 위첨자 형식을 지정합니다(그림 16).
그림 16
4. 파일을 저장합니다. 브라우저를 통해 봅니다. 웹 페이지는 다음과 같아야 합니다(그림 17).
그림 17
3. 이미지 삽입
HTML 페이지를 만드는 방법 기사에서는 웹 페이지에 이미지를 배치하는 방법을 살펴보겠습니다.
태그는 이미지를 삽입하는 데 사용됩니다. .
이 태그의 필수 속성은 소스(영어 SouRCe에서 - 출처). 경로를 결정합니다. 그래픽 파일, 그의 이미지가 웹 페이지에 표시되어야 합니다.
이미지를 삽입하려면 다음 명령을 사용하십시오. 
예를 들어: "
이미지1.jpg"
alt="이미지" />
!}
비활성화된 이미지 모드에서 웹 페이지를 볼 때 누락된 이미지 대신 alt 속성으로 쓰여진 비문이 있도록 alt 속성이 필요합니다. 또한 항상 대체 텍스트를 사용하는 것이 좋습니다. 검색 엔진은 이미지를 검색할 때 키워드로 구문 분석합니다.
그래픽 파일은 다음 형식일 수 있습니다. jpg, gif, png 및 반드시 컬러 모델RGB.
연습 6
1. 주택 면적 목록 후 웹 페이지에 별장 프로젝트 이미지 삽입 프로젝트_1.jpg그리고 프로젝트_2.jpg폴더에서 cd/html_CSS_1 . 이렇게 하려면 먼저 이 두 이미지를 main.html 파일이 있는 폴더에 복사합니다. 이미지를 삽입하는 코드는 다음과 같습니다(그림 18).
그림 18
2. 브라우저에서 결과를 봅니다(그림 19).
그림 19
기본적으로 태그를 사용하는 원리HTML명확해야합니다. 동일한 원칙에 따라 사용됩니다. 태그가 컨테이너 태그인 경우 여는 태그와 닫는 태그가 있습니다. 태그가 단일인 경우 닫는 태그가 없습니다. 이 경우 닫는 꺾쇠 괄호 앞에 오른쪽 슬래시가 기록됩니다. 예를 들어< br/>. 태그가 컨테이너 태그이든 단일 태그이든 항상 사양을 볼 수 있습니다."요소" 섹션의 html401_ru.chm.
4. 사이트 내 주소 지정
첫 번째 자습서인 "HTML 페이지를 만드는 방법"에서는 HTML 주소 지정의 개념을 살펴봅니다.
사이트의 다른 폴더에 있을 수 있는 html 파일에 이미지를 배치해야 하는 경우 주소 지정 옵션을 고려하십시오.
두 가지 유형의 주소 지정이 있습니다.
절대 주소 지정 (컴퓨터 드라이브 이름 사용) 사용하지 않음(그림 20)
그림 20
사용된 상대 주소 지정 - 동일한 서버에 있는 문서 또는 문서 모음 내 주소 지정. 사이트 내에서 파일을 참조하려면 원하는 파일에 도달하기 위해 거쳐야 하는 경로를 브라우저에 알려야 합니다.
|
예 1 이미지는 HTML 문서와 같은 폴더에 있습니다(그림 21). 즉, 이미지와 HTML 파일은 파일 시스템 HTML 문서는 즉시 이미지를 첨부할 수 있습니다. 이 경우 웹 페이지에 이미지를 삽입하면 다음과 같습니다.
그림 21 실용적인 작업7 예제 1을 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 영상 |
|
예 2 영상 사진. jpg폴더에 있습니다 폴더_1 . HTML 문서는 folder_1 외부에 있습니다. 저것들. 사이트의 파일 시스템에서 HTML 문서는 이미지보다 한 수준 위에 위치합니다(그림 22). folder_1을 입력한 다음 이미지를 첨부해야 합니다.
그림 22 실용적인 작업8 예제 2를 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 이미지는 doc.html 웹 페이지에 삽입되어야 합니다. |
|
예 3 영상 사진. jpg폴더에 있습니다 폴더_1 , 차례로 폴더에 있습니다. 폴더_2 . HTML 문서는 이러한 폴더 외부에 있습니다(그림 23). 따라서 HTML 문서는 이미지보다 두 단계 더 높습니다. 필요한:
그림 23 실용적인 작업9 예제 3을 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 이미지는 doc.html 웹 페이지에 삽입되어야 합니다. |
|
예 4 폴더_1 . 이미지는 folder_1 외부에 있습니다. 저것들. HTML 문서는 이미지보다 한 수준 아래에 있습니다(그림 24). folder_1 폴더를 종료한 다음 이미지를 첨부해야 합니다. 폴더 종료는 구문으로 표시됩니다. ../ (오른쪽에 두 개의 점과 슬래시).
그림 24 실용적인 작업10 예제 4를 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 이미지는 doc.html 웹 페이지에 삽입되어야 합니다. |
|
실시예 5 HTML 문서는 폴더에 있습니다. 폴더_1 , 차례로 폴더에 있습니다. 폴더_2 . 이미지는 이러한 폴더 외부에 있습니다. 따라서 HTML 문서는 이미지보다 두 수준 아래에 위치합니다(그림 25). 필요한: 2번 출구를 나와야 하기 때문에 공사가 ../ 두 번 반복합니다.
그림 25 연습 11 예제 5를 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 이미지는 doc.html 웹 페이지에 삽입되어야 합니다. |
|
실시예 6 (그림 26) 필요한:
그림 26 연습 12 예제 6을 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 영상 doc.html 웹 페이지에 삽입해야 합니다. |
|
예 7 (그림 27) 필요한: 3번 출구를 나와야 하기 때문에 공사가 ../ 세 번 반복합니다.
그림 27 연습 13 예제 7을 구현합니다(폴더 생성, doc.html 파일, 이미지 촬영). 영상 doc.html 웹 페이지에 삽입해야 합니다. 따라서 몇 번이나 종료해야하는지 ../ 구성을 여러 번 입력하고 입력하면 경로에서 만난 폴더의 이름을 나열합니다. |
/
>
/
>
/
>
연습 14
1. html 문서를 생성하고 이미지의 경로가 다음과 같이 되도록 이미지를 붙여넣습니다.
"
../../../../../../folder_1/folder_2/folder_3/image.jpg" /
>
2. html 문서에 이미지를 삽입하는 자신만의 예제를 개발하여 다음을 포함하고 출구 폴더에서 입구 폴더에. 예제는 위의 모든 예제와 달라야 합니다.
이 테마의 결과로 다음 파일이 있어야 합니다.
많은 언어가 발명되었지만 HTML은 특별하고 가장 많이 찾는 언어 중 하나입니다. 다른 많은 주요 프로그래밍 이니셔티브가 이와 관련되어 있습니다. 마크업 언어인 HTML(HyperText Markup Language)에 대한 지식이 개발자의 마음에 있을 때 많은 것을 사용할 수 있습니다.
본질적으로 HTML에는 복잡한 것이 없으며 몇 분 안에 프로그래밍과 인터넷에서 가장 멀리 떨어진 사람이 메모장에 HTML 페이지를 만들 것입니다. 주목할 만한 예는 실제로 모든 사람이 접근할 수 있는 단순성입니다.
일반적인 설명
HTML 파일은 논쟁의 여지가 있지만 사이트의 한 페이지이지만 하나의 파일이 한 페이지를 구성한다는 사실은 처음부터 분명합니다.
HTML 파일은 파일 형식이 HTML임을 나타내는 DOCTYPE 헤더로 시작합니다. 모든 페이지 요소(태그)는 꺾쇠 괄호 안에 표시됩니다. 각 쌍 ("<» и «>")는 단일 HTML 태그를 포함합니다. 일반적으로 HTML 태그는 쌍을 이룹니다. 즉, 각 "태그"에 대해 "/태그"가 있습니다. 둘 다 꺾쇠 괄호로 묶여 있습니다. 단일 태그가 있으며 그 중 가장 많이 사용되는 "br/"은 다음 줄로의 전환입니다.
파일에서 가장 큰 태그는 HEAD와 BODY라는 두 개의 태그만 포함하는 HTML 자체입니다. 첫 번째에는 다양한 설명이 있고 페이지에 필요한 다른 파일에 대한 링크가 표시되어 있습니다. PHP 스크립트그리고 자바스크립트. 두 번째는 페이지의 내용을 기록합니다. 또한 태그 및 스크립트의 형태로 제공됩니다.
단순 HTML 페이지
이러한 페이지를 만드는 예는 아래 기사에 나와 있습니다. 신중하게 고려해 봅시다.
헤드 섹션
주요 목적은 페이지와 공통 스크립트에 대한 일반적인 설명이지만 후자는 다소 상대적인 개념입니다. 일반적으로 여기에서는 두 가지만 중요합니다.
페이지 콘텐츠 표시의 경우 이 섹션의 콘텐츠는 다른 파일 어딘가에 다른 언어의 태그 및 스크립트에 대한 CSS 규칙이 있음을 나타내므로 간접적으로만 관련이 있습니다.
방문자가 페이지가 열려 있는 탭 위로 마우스를 이동하면 표시되는 HTML 페이지가 있습니다. 이것 중요한 점, 즉, 읽을 수 있는 텍스트로 서명되어 페이지를 훨씬 더 보기 쉽게 만들기 때문입니다.
META 태그는 일반적으로 인터넷 프로그래밍에서 중요하지만 메모장에서 HTML 페이지를 작성해야 하는 경우 불필요한 구성으로 예제를 어지럽히는 것은 바람직하지 않습니다.
HTML에 대한 지식이 확고해지면 스크립팅에 접근해야 한다면 Cascading Style Sheets를 즉시 다루어야 합니다. CSS 파일은 특히 HTML 태그 서식 지정 규칙을 제공합니다.
섹션 본문
실제로 샘플 HTML 페이지는 BODY 섹션입니다. 여기에는 사이트 페이지의 모든 정보와 콘텐츠가 포함되어 있습니다. 모든 정보는 JavaScript 코드나 PHP 프로그램 조각을 삽입하는 것과 같은 태그와 스크립트의 형태로 제공됩니다.
예를 들어 이해하는 것이 중요합니다. HTML 웹 페이지브라우저와 텍스트 편집기, 특히 메모장에서 동일한 예에서 이것은 동일한 것과는 거리가 멀다. 첫 번째 경우에는 모든 스크립트가 실행되는 기성 HTML 텍스트가 있습니다. 예를 들어, PHP는 적절한 위치에 코드 대신 필요한 태그를 구성하고 해당 부분을 수행했습니다. 아직 별도로 논의되지는 않았지만 JavaScript도 임무를 완수했습니다.
HTML은 스크립트가 아니라 태그입니다. 궁극적으로 브라우저는 페이지의 콘텐츠와 태그만 표시합니다. 거기에는 PHP 코드가 없습니다.
JavaScript는 특별한 위치에 있으며 로드(다시 로드)하는 순간뿐만 아니라 페이지가 방문자의 브라우저에 있는 순간에도 페이지를 제공하는 데 관심이 있습니다.
간단한 예(BODY 섹션만)가 아래에 나열되어 있습니다.
방문자의 브라우저에는 다음과 같이 표시됩니다.
코드는 브라우저에 표시되는 요소의 모양을 지정하지 않았습니다. 보이는 모든 스타일은 CSS 규칙에 있습니다. 이 경우 참조된 Mcss/scPhpWordRW.css 파일에 있습니다(첫 번째 HTML 페이지 예제 참조).
HTML과 달리 CSS 테마는 더 간단하고 접근하기 쉬운 규칙이 있으며 HTML 페이지를 만드는 예에 메모장 외에는 아무것도 필요하지 않은 경우 그 수가 적습니다. 즉각적인 개발을 위해 모든 것이 매우 접근 가능합니다.
이것은 scLogo_vDoc 태그가 얼마나 간단하게 설명되는지 보여줍니다. 설명은 일반적으로 태그가 vDoc-logo.png 이미지를 표시하고 마우스를 가져가면 vDoc-logo-h.png 이미지를 표시합니다.
HTML 설명의 구조
언어는 어떤 구조도 암시하지 않으며 여기서 구문의 개념은 매우 상대적입니다. 여기에는 변수가 없지만 많은 가능성이 있습니다. 하이퍼텍스트의 기본은 이름이 있어야 하는 요소(태그)가 있다는 것입니다.
쌍을 이룬 태그의 경우 이름은 실제 이름(tagName)과 꺽쇠 괄호("<» + tagName +«>"), 만약에 우리 대화하는 중이 야태그의 시작 부분과 "” 끝이 녹음된 경우.
속성을 설명하는 HTML 페이지의 예는 텍스트 아래에 있습니다.
태그는 속성을 가질 수 있으며, 이 경우 닫는 꺾쇠 괄호 ">" 앞의 태그 이름 뒤에 공백이 있습니다. 태그에 속성이 있는 경우 속성은 태그의 시작 부분에만 기록됩니다. 태그의 내용은 태그의 시작과 끝 사이에 있는 내용입니다.
HTML을 사용하면 블록 및 인라인 요소를 설명할 수 있습니다. 전자는 브라우저 창의 특정 영역을 차지하고 절대적으로 위치할 수 있습니다. 즉, HTML 페이지의 표시 영역에서 올바른 위치에 특정 크기를 가질 수 있습니다.
인라인 요소는 일반적으로 하나의 스트림으로 표시됩니다. 즉, 페이지 파일에 지정된 대로 화면에 표시됩니다. 공유 흐름의 표시는 페이지가 로드될 때 영향을 받을 수 있습니다. 블록 수준 요소의 배치, 가시성 및 기타 속성은 JavaScript 코드를 통해 언제든지 영향을 받을 수 있습니다.
간단한 요소 외에도 HTML은 테이블과 양식을 설명하는 기능을 제공합니다. 이러한 요소는 "일상적인 웹 사이트 구축"에서 매우 수요가 많습니다.
테이블 설명: TABLE, TR, TD 태그
TABLE 태그를 사용하여 테이블을 만들고 특정 수의 TR 행을 지정하고 각 행에서 특정 수의 TD 셀을 지정할 수 있습니다. 일반적인 테이블 구성과 달리 HTML 마크업의 특성으로 인해 테이블 구성은 이 선언으로 제한되므로 개발자가 모든 행의 열 수가 동일한 직사각형 테이블을 갖고 싶다면 다음을 따라야 합니다. 이것은 스스로.
HTML의 기본 위치는 지정된 모든 작업을 수행하지만 이해되지 않는 작업은 수행하지 않는 것입니다. 경우에 따라 테이블의 각 행에 있는 열의 수는 그다지 중요하지 않지만 셀을 세로 또는 가로로 병합해야 하는 경우 모든 것을 매우 신중하게 계산해야 합니다.
간단한 테이블을 설명하는 HTML 페이지의 예가 기사에 명확하게 나와 있습니다.
다음은 3행 3열 크기의 표로, 첫 번째 행에는 TD 태그 대신 열 제목인 TH 태그를 사용했습니다. 이 두 태그는 특별한 차이는 없지만 첫 번째 태그를 사용하여 표의 첫 번째 행을 구분하는 것은 상당히 가능하며 CSS에서는 TH에 자신만의 스타일을 붙일 수 있어 다른 TD와 구별됩니다.
양식 설명: FORM, INPUT 태그
양식은 HTML 태그에서 가장 많이 요청되는 부분입니다. 양식을 사용하여 정보를 제출할 수 있습니다. 실제로 페이지 자체는 정보의 출력이지만 양식은 입력입니다.
간단한 양식을 설명하는 HTML 페이지의 예:
양식을 사용하기 위한 더 많은 옵션이 있지만 주요 기능은 다음과 같습니다. 입력 필드를 지정하고 사용자 입력 구문 분석을 위한 디자인 및 핸들러를 할당할 수 있습니다. 숨겨진 필드를 지정하고 페이지에서 배경 정보를 전달할 수 있습니다. 정보 전송 프로세스를 시작하는 버튼을 클릭하여 정보 전송 버튼을 지정할 수 있습니다.
HTML 사용
하이퍼 텍스트 언어를 아는 것은 인터넷 프로그래밍 분야의 모든 전문 분야에서 작동하지만 PHP 또는 JavaScript로 프로그램을 작성해야 하는 경우 HTML + CSS를 완벽하게 알아야 합니다.
이전 예제에서 PHP 언어를 지정했습니다. PHP는 서버에서 실행되므로 이 양식이 있는 페이지는 필드가 채워진 상태로 서버에서 브라우저로 이동했습니다. 특히 INPUT 태그(onblur 이벤트 핸들러)에 언급된 TestOnBlur 함수는 모든 매개변수를 텍스트 필드로 받았습니다.
JavaScript는 브라우저에서 작동하며 서버로 데이터를 다시 보내는 버튼이 올바르게 작동하려면 onclick=jQuery("#to").val("cart")와 같은 구성이 필요합니다. jQuery가 무엇인지 뿐만 아니라 #to, val, cart가 무엇인지에 대한 아이디어입니다. 보다 구체적으로, 기본적인 HTML 태그와 일반 규칙 CSS 스타일을 적용합니다.
이것은 인터넷 프로그래밍 분야의 모든 전문 분야에서 기술을 빠르게 향상시키기에 충분합니다.
친애하는 블로그 독자 여러분 안녕하세요. 이 기사를 통해 HTML 언어의 기본 사항을 배우기 시작합니다.
인터넷의 주요 언어가 하이퍼텍스트 마크업 언어(HTML). 이 기사에서는 HTML의 기본 개념을 배우고 가장 간단한 WEB 페이지를 만드는 방법을 배웁니다.
가장 중요한 것부터 시작하여 작동 방식을 고려하십시오. 월드 와이드 웹— 인터넷. 웹 페이지를 얻으려면 HTML로 작성된 파일을 만들어 웹 서버에 저장합니다. 그 후에는 컴퓨터, 전화 또는 태블릿 등 인터넷 액세스가 가능한 장치에 설치된 모든 브라우저에서 웹 페이지를 찾을 수 있습니다.
웹 서버특수 기능이 있는 일반 컴퓨터입니다. 소프트웨어인터넷 액세스. 웹 페이지, 이미지, 오디오 및 비디오 파일에 대한 브라우저의 요청을 지속적으로 기다립니다. 이러한 리소스 중 하나에 대한 요청을 받으면 서버는 이를 찾아 브라우저로 보냅니다.
브라우저- 이것 특별 프로그램, 예를 들어 웹사이트를 볼 수 있도록 설계됨 인터넷 익스플로러. 브라우저로 링크를 클릭하여 웹 서핑을 합니다. 이러한 클릭으로 인해 브라우저는 웹 서버에 html 페이지를 요청하고 응답을 받고 창에 페이지를 표시합니다. 페이지가 표시될 때 HTML 언어가 작동하여 브라우저에 웹 페이지의 구조와 콘텐츠에 대한 모든 정보를 알려줍니다. 명령의 도움으로 - 태그, HTML은 텍스트의 단락이 시작되는 위치, 텍스트의 어느 부분이 제목인지, 표와 그림을 삽입할 위치를 브라우저에 알려줍니다. 예를 들어 태그는 꺾쇠 괄호 안에 있는 단어입니다.
,
