HTML 태그 및 사용

HTML 문서 구조

<! DOCTYPE HTML> 
<HTML LANG = "에서 zh-CN"> 
<head> 
  <메타 캐릭터 = "UTF-8"> 
  <TITLE> CSS样式优先级</ TITLE> 
</ head> 
<body> 

</ body> 
</ HTML>

  

1. <! DOCTYPE HTML>는 HTML5 문서의 선언.

2. <HTML> </ HTML> 문서의 태그는 시작과 끝 태그입니다. 그 (것)들의 사이에서 루트 요소의 HTML 페이지, 문서 (머리)과 몸 (신체)의 머리입니다.

3. <머리> </ head>은 HTML 문서의 시작을 정의합니다. 그들 사이의 내용은 문서 창 브라우저에 표시되지 않습니다. 이 문서 위안 (메타) 데이터를 포함합니다.

4. <제목>, </ 제목>는 페이지 제목이 브라우저 제목 표시 줄에 표시됩니다 정의합니다.

의 <body> </ body> 사이의 텍스트가 표시 페이지의 본문 내용이다.

HTML 서식 태그

1.HTML 태그 등 <HTML> <DIV> 등 꺾쇠 괄호로 둘러싸인 키워드입니다

2.HTML 태그는 다음과 같은 쌍에 보통 <DIV>와 </ DIV> 태그는 첫 번째 레이블 끝을 시작한다. 닫기 태그는 슬래시됩니다.

3. 라벨의 부분은 또한 같은 별도로 표시되어 <BR/> <HR /> <IMG SRC = "1.JPG"/> 등을들 수있다.

4.없이 속성 수 있습니다 속성을 여러 레이블이있을 수 있습니다

태그 구문 :

1. <태그 속성 이름 = 1 "속성 값 1"속성 2 = "속성 값 2"...> 콘텐츠 부 </ 태그 이름>

2. <태그 속성 이름 = 1 "속성 값 1"속성 2 = "속성 값 2"... />

몇 가지 매우 중요한 특성 :

1.id : 고유 ID 정의 태그, 고유의 HTML 문서 트리

2.class : html 요소에 대해 하나 이상의 클래스 명 (클래스 명) (CSS 스타일 클래스 이름을) 정의

3.style : 지정된 요소의 인라인 스타일 (CSS 스타일)

[A] 헤드 태그에서 사용

 

메타 태그 설명 :

  • <메타> 요소는 검색 엔진의 페이지와 설명 및 키워드를 업데이트하는 주파수에 대한 메타 정보를 제공합니다.
  • <메타> 콘텐츠를 포함하지 않는 문서의 머리에 태그입니다.
  • <메타은> 제공된 정보는 사용자에게 보이지 않는다.

메타 태그로 구성 : 메타 태그는 두 가지 속성을 가지고 서로 다른 속성이 서로 다른 매개 변수 값을 가지고, HTTP-당량 이름 속성이며, 서로 다른 매개 변수 값은 다른 페이지 기능을 달성했다. 

1.http-당량 속성 : HTTP 파일의 머리의 역할에 해당이 브라우저에 제대로 도움이 웹 콘텐츠를 표시하는 몇 가지 유용한 정보를 반환 할 수 있으며, 해당 속성 값의 내용은, 내용이 사실의 내용입니다 각 매개 변수 값

<! - 인코딩 형식 지정된 문서 (알 필요) -> 
< 메타 HTTP-당량 = "Content-Type을" 문자 집합 = UTF8 " >   
<! - 이초 해당 웹 사이트로 점프 후, 알아보기 (인용 부호에주의 ) -> 
< 메타 HTTP-당량 = "새로 고침" 내용 = "2 = HTTPS의 URL : //www.oldboyedu.com" > 
<! - (이해) 가장 고급 모드에서 문서를 렌더링하는 IE를 말할 -> 
< 메타 HTTP-당량 = "X-UA 호환" 내용 = "의 IE = 엣지" >

2.name 속성

주로 그에 대응하는 페이지의 콘텐츠 속성 값을 기술하는 데 사용되는 주요 콘텐츠의 콘텐츠 정보와 분류 정보를 찾기 위해 검색 엔진 로봇을 용이하게하는 것이다.

[디] 태그 본문에서 사용

<B> 굵게 </ B> 
<I> 이탤릭체 </ I> 
<U> 밑줄 </ U> 
<S> </ S> 삭제 
<P> 단락 태그 </ P> 
제목 1 </ H1 <의 H1을> > 
<H2> 타이틀 2 </ H2> 
<H3> 타이틀 3 </ H3>. 
<H4> 타이틀 4 </ H4>. 
<H5> 타이틀 5 </ H5>. 
<H6> 타이틀 6 </ H6>. 
<! - 포장 -> 
로 <br> 
<! - 수평선 -> <시간>

 특수 문자 :

 

div 태그 및 라벨에 걸쳐

div 태그는 블록 레벨 요소를 정의하는 데 사용되는, 실질적인 의미가 없다. 주로 CSS 스타일을 통해 그것을 다른 성능을 제공합니다.
스팬없는 실용적인 의미의 인라인 (내선) 요소를 정의하는 데 사용된다. 주로 CSS 스타일을 통해 그것을 다른 성능을 제공합니다.

블록 레벨 요소와 인라인 요소 차이 다음
소위 블록 요소, 별도의 라인 개시 렌더링 요소에 기반 인라인 요소는 새로운 라인을받지 않는다. 별도의 웹 페이지에서이 두 가지 요소를 삽입하면 페이지에 영향을주지 않습니다.
이 두 요소는 태어난 CSS 스타일을 위해 특별히 정의되어있다.

참고 :

중첩 된 태그 정보 : 블록 요소는 일반적으로 일부 인라인 요소 또는 블록 요소를 포함 할 수 있지만, 요소는 다른 인라인 요소를 포함 할 수 인라인 블록 요소를 포함 할 수 없습니다.

블록 레벨 태그 레이블을 포함 할 수 없습니다 p는 레이블 P는 p 태그를 포함 할 수 없습니다.

 

img 태그

<IMG SRC = "이미지 경로"ALT = "프롬프트 이미지가 성공적으로로드되지 않은 경우"에만 두 가지 속성이 자동으로 같은 제목 = "마우스가 일시 중단 된 메시지"폭 = "폭"높이 = "높은 (폭과 높이 줌비) ">

 

라벨

하이퍼 링크 라벨

웹 페이지에서 소위 하이퍼 링크가 목표에 연결 지점 사이의 관계를 의미, 다른 웹 페이지가 될 수있는이 목표는이 같은 페이지의 다른 위치 일 수있다, 또한 사진, 이메일 주소, 파일, 또는 할 수있다 응용 프로그램.

<a href="http://www.oldboyedu.com" target="_blank"> 点 我 </a>를

href 속성은 방문 페이지 주소를 지정합니다. 주소는 여러 종류의 수 있습니다 :

  • 절대 URL - 다른 사이트에 점 (예 : HREF 등 = "http://www.jd.com)
  • 상대 URL - 정확한 경로에 현재 사이트 (HREF = "index.htm으로")을 의미
  • 앵커 URL - 페이지 앵커 포인트 (HREF = "# 위로")

목표:

  • _blank는 새 탭에서 열기 방문 페이지를 의미합니다
  • _self는 현재 탭에서 방문 페이지를 엽니 다 의미

명부

1. 정렬되지 않은 목록

<UL 타입 = "디스크"> 
  <LI> 제 </ 리> 
  <LI> 제 </ 리> 
</ UL>

속성 유형 :

  • 디스크 (고체 원, 기본값)
  • 원 (오픈 원)
  • 광장 (고체 사각형)
  • 없음 (더 스타일 없음)

2. 정렬 된 목록

<OL 타입 = ". 1"시작 = "2"> 
  <LI> 제 </ 리> 
  <LI> 제 </ 리> 
</ OL> 

속성 유형 :

  • 번호 목록, 기본값
  • 대문자
  • 소문자 문자
  • Ⅰ 수도 로마
  • Ⅰ 소문자 로마

3. 제목의 목록

<DL> 
  <DT> 타이틀. 1 </ DT> 
  <DD> 내용. 1 </ DD> 
  <DT> 제목 2 </ DT> 
  <DD> 내용. 1 </ DD> 
  <DD> 개요 2 </ DD> 
</ DL>

  

[세 표

데이터 테이블은 테이블은 복수의 셀은 제리 유닛은 텍스트 콘텐츠, 목록, 패턴 형성, 숫자, 기호, 텍스트, 및 다른 프리폼 등을 포함 할 수있는 다른 행을 형성하는 행으로 구성되는 2 차원 공간이다.
테이블의 가장 중요한 목적은 범주 데이터를 나타내는 표이다. 클래스 데이터 테이블은 테이블 형식으로 최적의 조직을 의미한다 (즉, 행과 열로 조직 된) 데이터

테이블의 기본 구조 :

<표> 
  <THEAD> 
  <TR> 
    <제>序号</ 일> 
    <제>姓名</ 일> 
    <제>爱好</ 일> 
  </ TR> 
  </ THEAD> 
  <TBODY> 
  <TR> 
    <TD> 1 </ TD> 
    <TD> 에곤 </ TD> 
    <TD>杠娘</ TD> 
  </ TR> 
  <TR> 
    <TD> 2 </ TD> 
    <TD> 원발 </ TD> 
    <TD>日天</ TD> 
  </ TR> 
  </ TBODY> 
</ 테이블>

특성 :

  • 국경 : 표 테두리.
  • 의 cellpadding : 패딩
  • cellspacing : 여백.
  • 폭 : 화소의 비율 (길이 및 폭은 바람직 CSS에 의해 설정된다).
  • ROWSPAN : 얼마나 수직 교차 세포주
  • 열 병합 : 얼마나 많은 열을 셀 스팬 (즉, 병합 된 셀입니다)

[네] 양식

특징 :

사용자로 하여금 서버에 전송을위한 폼 데이터는 웹 서버와 상호 작용하는

양식 등등 텍스트 필드, 체크 박스, 라디오 버튼, 제출 버튼 등의 입력 라벨의 시리즈를 포함 할 수 있습니다.

또한 텍스트 영역을 선택, 필드 셋 레이블과 레이블을 포함 할 수 있습니다 양식

특성 :

 

 

 

 양식 요소 :

기본 개념은 :
HTML은 동적 웹 사이트 콘텐츠를 만드는 데 매우 중요하므로 HTML 양식 요소보다 복잡한 부품 종종 양식 및 스크립트, 동적 페이지, 데이터 처리 및 기타 기능이 결합이다.
일반 정보 양식을 입력 사용자 수집하는 데 사용되는
형태의 작품을 :
방문자가 웹 양식을 탐색하는 동안, 당신은 필요한 정보를 입력 한 후 제출 버튼을 누를 수 있습니다. 이 정보는 인터넷을 통해 서버로 전송된다. 
오류가 오류 메시지를 반환하고 오류를 수정 요청이있는 경우 서버에 특별한 프로그램은 데이터를 처리합니다. 데이터가 완전하고 올바른 경우, 입력 서버는 피드백 정보를 작성.

 

[다섯] 입력

<입력> 요소는 속성 유형에 따라 다를 수는 다양한 형태로 변경된다.

 

 

 

속성 설명 :

  • 양식, "키"를 제출하고 ID를주의한다 차이 : 이름
  • 값 : 양식의 해당 항목의 값이 제출
    • 유형 = "버튼", "재설정", "제출"는 내용의 텍스트가 버튼에 표시 될 때
    • = "텍스트", "암호"를 입력 할 때 초기 값 입력 상자의 "숨겨진"
    • = '체크 박스」, 「라디오 ","파일 ", 입력과 연관된 값을 입력
  • 확인 : 라디오와 체크 박스가 기본 항목으로 선택되어
  • 읽기 전용 : 텍스트 및 설정 읽기 전용 비밀번호
  • 비활성화 : 모든 입력이 적용

[여섯] 선택 태그

<form action="" method="post">
  <select name="city" id="city">
    <option value="1">北京</option>
    <option selected="selected" value="2">上海</option>
    <option value="3">广州</option>
    <option value="4">深圳</option>
  </select>
</form>

属性说明:

  • multiple:布尔属性,设置后为多选,否则默认单选
  • disabled:禁用
  • selected:默认选中该项
  • value:定义提交时的选项值

label标签

定义:<label> 标签为 input 元素定义标注(标记)。
说明:

    1. label 元素不会向用户呈现任何特殊效果。
    2. <label> 标签的 for 属性值应当与相关元素的 id 属性值相同。

 

추천

출처www.cnblogs.com/wujc3/p/11454969.html