Xiaoqiang의 HTML5 모바일 개발 과정(1) - HTML 소개-H5 튜토리얼-php.cn

Xiaoqiang의 HTML5 모바일 개발 과정(1) - HTML 소개

黄舟

풀어 주다： 2017-01-22 10:17:25

원래의

1316명이 탐색했습니다.

HTML은 HyperText Markup Language의 약어로, 모든 웹페이지의 기본 구조를 구성하는 텍스트와 태그의 조합입니다.

1. 현재 시중에 나와 있는 인기 브라우저

IE/Chrome/firefox/opera

Xiaoqiang의 HTML5 모바일 개발 과정(1) - HTML 소개

Chrome/firefox/opera 및 IE 9/10은 모두 HTML5와 매우 호환됩니다

2. HTML 태그

html 태그는 모두 ""로 끝납니다. 괄호 끝

(예:

일반적으로 사용되는 속성은 id, class, style, title

id: 이 속성은 레이블이 가리키는 객체의 이름을 제공합니다.

class: 이 속성은 객체의 클래스 이름을 제공합니다.

style: 이 속성은 해당 클래스에 적용됩니다. CSS 스타일

제목: 개체에 제목을 지정합니다. 대부분의 브라우저는 마우스가 그 위로 지나갈 때 메시지를 표시합니다.

다음 Android 개발에서는 태그의 사용을 살펴보겠습니다. , 역시 우리의 인사입니다.

<html>  
    <head>  
        <title>first html</title>  
<!--refresh:刷新-->  
        <meta http-equiv="refresh" content="1;url=http://blog.csdn.net/dawanganban&#39;">  
<!-- 表示每隔1秒向url地址刷新 -->  
        <meta http-equiv="content-type" content="text/html;charset=utf-8">  
<!--引入一个样式文件-->  
        <link rel="stylesheet" type="text/css" href="style.css">  
      
    </head>  
    <body>  
        hello word  
    <body>  
</html>

로그인 후 복사

3. 중요 표시

(1) 링크

target="_black": 새 창에서 링크 열기

target="_selt": 기본값, 현재 창에서 열기

(2) 이미지 링크

<a href="地址" border="0"><img  src="test.jpg" alt="Xiaoqiang의 HTML5 모바일 개발 과정(1) - HTML 소개" ></a>

로그인 후 복사

border 속성값 : 기본 테두리를 제거하기 위함입니다.

(3) 이메일 보내기

<a href="mailto:739299362@qq.com?subject=hello">发邮件</a>
 （4）锚点（在同一页面进行跳转）
<a name="top">跳到这里</a>
<a href="#top">跳到top</a>

로그인 후 복사

(5) 테이블

<table border="1" width="60%" cellpadding="10" cellspacing="0">
<tr><td>表格一</td><td>表格二</td></tr><tr><td>BIAOGE</td><td>BIAOGE</td></tr>
</table>

로그인 후 복사

테이블 정렬

align 속성: 가로 정렬. 값: 왼쪽(기본값): 왼쪽/rignt/center

valign 속성: 수직 정렬. 값: 상단/하단(기본값)/중간
불규칙 테이블
colspan 속성: 가로 셀 병합(열 병합)
rowspan 속성: 세로 셀 병합(행 병합)
테이블 중첩 가능

<table>
<caption>主题</caption>   只能是0个或者1个
<thead>表头</thead>       只能是0个或者1个
<tfoot>表脚</tfoot>
<tbody>表体</tbody>
</table>

로그인 후 복사

테이블 정의 완료 (6) 양식

<form action="服务器端的一个程序" method="get/post">
<!--input标记-->
<!--非input标记-->
      </form>
      1)input标记：
文本输入框:<input type="text" name="username" value="缺省值"/><!--必须加name-->
提交按钮： <input type="submit" value="确认"/>
密码输入框：<input type="password" name="pwd"/> <!--必须加name-->
单选：<input type="radio" name="gender" value="m"/><!--必须加name和value-->
   <!--同一组name必须相同-->
多选：<input type="checkbox" name="interest" value="fishing"/>
重置：<input type="reset" value="取消"/>
普通按钮：<input type="button" value="点我吧"/>
上传文件：<input type="file" name="file1"/>
隐藏域：<input type="hidden" name="userId" value="123">
      2)非input标记

로그인 후 복사

드롭다운 목록:

<select name="city" multiple="multiple">
<option value="bj">北京</option>
<option value="wh">武汉</option>
<option value="nj">南京</option>
</select>
<!--加上mutiple属性就成为多选了-->

로그인 후 복사

여러 줄 텍스트 입력 상자:

<textarea name="desc" cols="" rows=""></textarea>

로그인 후 복사

(7) 목록

순서가 없는 목록:

<ul>
<li>item1</li>
<li>item2</li>
</ul>

로그인 후 복사

순서가 있는 목록:

<ol>
<li>item1</li>
<li>item2</li>
<ol>

로그인 후 복사

(8) 프레임

< 프레임셋>
큰 창을 여러 개의 하위 창으로 나누는 기능

<frameset rows="200,300,*">  <!--划分为三个窗口-->
<frameset rows="20%,*">  <!--按照百分比划分-->
<frame src="top.html"/>
<frameset cols="30%,*"/>
<frame src="left.html"/>
<frame src="right.html"/>
</frameset>
</frameset>
<iframe>

로그인 후 복사

현재 창에 하위 창을 삽입하는 기능

<iframe src="some.html" width="" height="">
</iframe>

로그인 후 복사

위 내용은 Xiaoqiang의 HTML5 모바일 개발 로드(1)-HTML 소개 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!

Php8, 나도 갈게

30분 안에 웹사이트 레이아웃 배우기

Shangguan Oracle 초보자부터 능숙한 비디오 튜토리얼까지

UNI-APP 코드의 첫 번째 줄

처음부터 앱 실행까지 Flutter

Lian 형제 새 Linux 비디오 튜토리얼

AXURE 9 비디오 튜토리얼(제품 관리자 대화형 제품 디자인 UI에 적합)

Zero 기본 숙련도 PS 비디오 튜토리얼

시작하는 데 도움이 되는 16일 UI 비디오 튜토리얼

PS 기술 및 슬라이싱 기술 비디오 튜토리얼

Alibaba Cloud 환경 구축 및 프로젝트 출시 비디오 튜토리얼

컴퓨터 네트워크 개요 - 프로그래머가 마스터해야 하는 기본 지식

프로그래머를 위한 필수 튜토리얼 - HTTP 프로토콜 설명

웹소켓 비디오 튜토리얼

Xiaoqiang의 HTML5 모바일 개발 과정(1) - HTML 소개