이 과정을 설명하기 전에 : 브라우저가 무엇인지 살펴 보겠습니다.
소위 브라우저는 HTML 코드를 해석하고 실행할 수있는 도구입니다. 브라우저를 알아 내야 할 또 다른 개념이 있습니다! = 즉, 즉, 브라우저 중 하나 일뿐입니다. IE 외에도 많은 브라우저가 있으며 Google에서 알 수 있습니다. 우리는 세부 사항으로 들어 가지 않을 것입니다.
먼저 HTML이 무엇인지 이해합시다
HTML이란 무엇입니까?HTML의 전체 이름 : 하이퍼 텍스트 마크 업 언어 (하이퍼 텍스트 마크 업 언어). 웹 페이지의 모양과 웹 페이지의 내용을 설명하는 텍스트입니다. HTML이 다양한 효과를 보여줄 수있는 이유는 브라우저의 기능입니다.
보충 컨텐츠 : 여기서는 동일한 HTML 텍스트 인 일부 컨텐츠를 확장하며 브라우저가 없으면 효과가 다를 수 있습니다. 여러 브라우저가 먼저 나타나고 해당 표준을 사용할 수 있기 때문입니다. 이 상황을 감안할 때 Ietester를 사용하여 다른 브라우저에서 동일한 HTML 코드의 호환성 문제를 테스트 할 수 있습니다.
2. 정적 페이지 및 동적 페이지
우리가 알아야 할 또 다른 것은 정적 페이지와 동적 페이지의 차이점입니다.
우선, 웹 사이트의 페이지는 정적 페이지와 동적 페이지로 나뉩니다.
정적 페이지 : 접미사 HTML 또는 HTML이있는 모든 정적 페이지는 정적 페이지이며 서버에 고정 HTML 페이지가 있습니다.
동적 페이지 : 서버에 사용자가 찾아야하는 페이지가 없지만 서버는 고객이 요구하는 HTML 페이지를 동적으로 생성 한 다음 고객에게 표시 할 수 있습니다.
한 문장에서 두 가지의 차이점을 요약하려면 : 동적 페이지가 서버 측 코드를 실행하고, 정적 페이지는 서버 측 코드를 실행하지 않습니다 (먼저 배울 수 있습니다. 결국 정적 페이지는 오늘 토론의 초점입니다).
3. HTML 페이지를 작성하는 방법은 무엇입니까?
HTML을 작성하기위한 많은 도구가 있습니다. 모든 사람이 메모장을 알고 있다고 생각하며 메모장으로 HTML 페이지를 쓸 수 있습니다. 물론 EditPlus/Ultraedit와 같은 고급 메모장을 사용하거나 DreamWeaver와 같은 도구를 사용할 수도 있습니다.
다음 그림은 HTML 웹 페이지의 기본 구조입니다.
위 그림에서 모든 내용이 <html> </html> 태그 내에 있음을 알 수 있습니다. <head> </head> 헤드 정보를 넣으면 페이지에 대한 설명이 페이지에 표시되지 않습니다. 페이지 제목은 <title> </title>에 설정되어 있으며 <title>은 <head>에만 배치 할 수 있습니다. <body> </body>는 페이지의 본문 이며이 태그의 텍스트는 웹 페이지에 표시됩니다. 물론 모든 페이지에는 최소한 이러한 부분이 포함되어야합니다.
팁 : 제목 태그의 끝 태그가 닫히지 않으면 전체 페이지가 표시되지 않습니다.
4. HTML과 XML의 유사점과 차이점
유사성 : 그것들은 모두 마크 업 언어이며, DOM을 통해 액세스 할 수 있으며 CSS를 통해 변경할 수 있습니다.
차이점 :
XML은 HTML 구문보다 더 엄격합니다. 시작 태그가 있으면 엔드 태그, 일관된 사례, 속성의 이중 따옴표 등이 있어야합니다. XML은 데이터 저장에 중점을두고 HTML은 데이터 표시에 중점을 둡니다.5.xhtml 및 dhtml
XHTML : Extensible Markup 언어는 XML 구문 사양과 더 일치하는 HTML입니다. XHTML의 출현은 주로 XML로의 전환입니다. XHTML에는 모든 소문자, 태그 페어링 및 이중 인용문 속성이 필요합니다.
DHTML : 동적 HTML의 약어는 동적 HTML입니다. HTML, 스타일 시트 및 JavaScript의 조합
보충 : 웹 표준은 표준이 아니라 일련의 표준 모음입니다.
웹 페이지는 구조, 성능 및 행동의 세 부분으로 구성됩니다.
구조 : 텍스트, 그림 및 기타 해당 언어 : XML, XHTML
표현 : 텍스트 크기 및 색상 등과 같은 스타일이라고도합니다. 스타일을 통해서도 달성됩니다. CSS
행동 : 클라이언트의 동적 효과는 일반적으로 JavaScript를 통해 완료됩니다. dom, ecmascript
다음으로, 주제에 대해 알아 보겠습니다. HTML에 일반적으로 사용되는 태그를 배우십시오.
6.html 태그
01, h 태그 (제목), HTML은 각각 서로 다른 크기의 글꼴을 나타내는 <h1> </h1>에서 <h6> </h6>까지 6 개의 H 태그를 정의합니다. H1은 가장 크고 H6은 가장 작습니다.
02, <br/> 그냥 입력, 자체를 닫는 태그입니다.
03, <p>는 분할입니다. <p> 전후에 비교적 큰 빈 공간이 있지만, 아니요.
04, <center> 센터 </center> 센터> 센터. (권장되지 않음)
05, <b> a </b> 대담하고 권장됩니다. <i> b </i> 이탤릭체. <u> c </u> 밑줄. <em> 황후, 이탤릭체
06, <font> </font> font tag, <font color = "red"size = "7"face = "Lishu"> 빨간색 </font>
07, <HR> 수평선의 일반적인 특성 : 색상 크기 (두께) 너비 (길이) 정렬 = 왼쪽/중심/오른쪽 (기본값이 플레이에 표시됨)
7. html 특수 문자
& quot;
& & & amp;
<& lt;
> & gt;
우주 & nbsp;
© & copy;
® & reg;
² & sup2;
¥ & 엔;
³ & sup3;
8. 이미지 형식 확장
9. 이미지 태그 : <img alt = "표시 할 수없는 프롬프트 텍스트">
ALT : 사진을 표시 할 수없는 프롬프트 텍스트.
10. 하이퍼 링크 :
HREF는 연결할 대상 페이지를 가리키고 대상 창을 가리키는 대상은 값이며 값이 가져옵니다.
_blank : 새 창에서 열립니다
_self : 자신의 창문에서 열립니다
_parent : 부모 창에서 열립니다
_top : 최상위 창에서 열리는 것을 의미합니다
프레임 이름 : 지정된 프레임에서 열립니다. (배우다)
앵커 링크 : 01 앵커 위치를 설정합니다
<a name = showbigimg> <img src = image/02.jpg> </a>
02. 앵커를 부릅니다
<a href =#showbigimg> 아름다운 여성을보세요 </a>
11. HTML 목록 :
순서가없는 목록, 주문 된 목록 및 정의 된 목록으로 나뉩니다
다양한 목록의 디스플레이 효과 다이어그램을 살펴 보겠습니다.
순서가없는 목록 :
<ul>
<li> </li>
<li> </li>
</ul>
주문 목록
<ol>
<li> </li>
<li> </li>
</ol>
정의 목록 :
<dl>
<dt> 중국 </dt>
<dd> 상하이 </dd>
<dd> 광저우 </dd>
<dd> 베이징 </dd>
</dl>
유형의 값은 1 , a, a, i, i, disc, circle, square 일 수 있습니다.
12. 표 : 때로는 레이아웃에 사용되는 일반 데이터를 표시합니다.
위 그림에서 볼 수 있듯이 표는 행과 열로 구성되며 행은 TR로 표시되며 열은 TD로 표시됩니다. Rowspan (병합 행), Colspan (및 평행)을 사용하여 셀을 병합 할 수도 있습니다.
연습 1 : HTML 코드를 사용하여 테이블을 출력하십시오
연습 2 : 테이블의 크로스 줄과 크로스 기둥
13. 양식
조치 기본적 으로이 페이지에 데이터를 제출하십시오
서버에 데이터를 제출하려면 <input>, <textarea>, <select> 등과 같은 양식 요소를 양식에 넣어야합니다. 입력 유형의 값은 다음과 같습니다.
점검 된 속성은 라디오 버튼 및 확인란에 대해 준비되어 있습니다.
라디오 버튼은 상호 배타적 인 값 세트에 사용되며 효과 다이어그램은 다음과 같습니다.
확인란 효과 다이어그램은 다음과 같습니다
버튼 제출, 재설정 버튼 및 일반 버튼의 세 가지 주요 유형이 있습니다.
드롭 다운 목록 상자
문법:
14. 멀티 라인 텍스트 상자 :
<textRea> text </textRea>, cols = "50", rows = "15"속성은 행 및 열의 수를 나타냅니다.
일반적인 형식 요소 사용 :
이것은 오늘 HTML에 대한 우리의 토론의 끝입니다.