1.基本骨架

<!DOCTYPE html>

<html>

<head><title>标题</title><meta charset="UTF-8"><link rel="icon" href="路径"/>（link自闭合）</head>

<body></body>

</html>

规范：标签要用<>括起来且要闭合，H5中<meta charset="UTF-8">例外，标签名和属性名要小写。

2.列表

有序<ol><li>内容</li>

<li>内容</li>

</ol>

无序<ul><li>内容</li>

<li>内容</li>

</ul>

定义描述列表<dl><dt>标题</dt>

<dd>内容<dd>

</dl>(标题顶格，内容缩进）

注：可用CSS相互转化：1，list-style-type:"样式"   2，list-style-image:url(路径）（图片代替序号） 3，list-style-posiition：inside/outside(序号是否在内容内）

3.常见标签:块级标签（自动换行）：标题<h1></h1>换行<br/>分割线<hr/>段落<p></p>预格式<pre></pre>引用<blockquote cite="地址"></blockquote>

行级标签(按行逐一显示）：文本<span></span>图片<img href="路径" title="标题" alt="无法加载" width="" height="" align="center" />(img 也是自闭合）短引用<q cite="地址"></q>强调加粗<strong></strong>强调倾斜<em></em>倾斜<i></i>加粗<b></b>

<a href="地址" title="指上的字" target="_self/_blank"></a>      锚链接1，设锚点 <a name="just"></a>2,<a href="#just"></a>(别的页面需在#前加文件名）

组合标签：图文组合：<figure><img src="路径"><figcation>标题</figcaption></figure>

分区标签：<div></div>常与CSS配合使用

4.表格<table><tr>

<td>1111</td>

<td>2222</td>

</tr></table>   一行两列    tr行     td列

重要属性  cellspacing   单元格间距 （合并边框style="border-collapse:collapse)  align整个表格在父容器位置   cellpadding  单元格内边距  border 表格最外边框宽度    background="路径"背景图

colspan跨列   rowspan跨行(跨行跨列都写在td后边）          优先级  td>tr>table

5.表单  常与table配合使用

<fom action="传送地址" method="get/post"(get快 post安全，信息量大）><fieldset>表单边界<legend>表单标题</legend>

<table><tr><td><input type="text" name="q" value="q"/></td></tr>(input常用属性1type种类 2value默认值  3placeholder提示内容  4name输入框的名字一般必不可少  5form 指向特定ID的表单6 autofocus 自动聚焦 7autocomlete自动提示         8required="required"必填）

（type常用属性1text文本2password密码3radio/checkbox单/多选4file文件后跟accept="文件类型"5submit提交6reset重置7image图形提交按钮8button)

<tr><td><select name="1"> <optgroup label="333"></optgroup> <option title="2">2</option></select></td></tr>(下拉栏目，名为333的组，选项为2）

<tr><td><textarea style="width:20px:height:20px; resize:none overflow:scroll/hidden/auto">内容</textarea></td></tr></table></form>(resize:none大小不允许修改)

属性名=属性值

1checked="checked"  单/多选默认选中    2selected="selected"下拉栏默认选中  3multiple="multiple"下拉栏多选   4disable="disable"禁用  5readonly="readonly"只读   6hidden="hidden"隐藏

H5入门的更多相关文章

  1. H5入门-xhtml+css2-第01节

    <!-- 声明版本号,DOCTYPE html是html5版本 --> <!DOCTYPE html> <!-- 声明网页语言 en-英文 zh-中文 zh-cn中文 - ...

  2. H5入门——HTML部分

    一.HTML的基本构成 1.<!DOCTYPE html>文档类型声明 <!--HTML的文档类型声明.声明这个文件是HTML5文件,让浏览器按照HTML5准备进行解析显示.文档类型 ...

  3. H5入门须知

    ---恢复内容开始--- 首先,让我们来了解一下H5是做什么的,H5全称为“超文本标记语言”.是对网页进行编辑的技术.H5运用Hbulider进行网页编辑.网页可以分为三部分分别是title(主题)u ...

  4. H5入门基础（一）

    我们还是围绕这几个问题来学习: 1.什么是H5? 2.为什么要用H5? 3.怎么用H5? 1.什么是H5? ♦HTML是指超文本标记语言(Hyper Text Markup Language). ♦H ...

  5. 快速入门cocos2d-x jsbinding

    如果你是一个cocos2d-x的老手,那你可以忽略这篇博文,如果你是一个接触过javascript,想通过HTML5做游戏的,但是苦于不知道如何下手,那么这篇博文可能会帮到你. cocos2dx-js ...

  6. 阿里云服务器搭建web项目小结

    前言 最近恰好有时间,自己搞了个云服务器试着搭建了个网站,遇到了一些问题,通过踩坑也涨了一些经验,遂记录一二,与后来者分享. 正文 1.博主用的阿里云服务器,为什么用它呢?一个是恰逢双十一,有优惠:另 ...

  7. 07. Web大前端时代之：HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  8. 移动H5开发入门知识，CSS的单位汇总与用法

    说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...

  9. H5移动端开发入门知识以及CSS的单位汇总与用法

    说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...

随机推荐

  1. C# 把byte[]输出为图片文件

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/HK_JY/article/details/80320381 /// <summary> ...

  2. makefile中 $@, $^, $<, $?含义

    $@ 表示目标文件 $^ 表示所有的依赖文件 $< 表示第一个依赖文件 $? 表示比目标还要新的依赖文件列表 例子 root_num.exe: root_num.o my_root.o gcc ...

  3. vue中修改了数据但视图无法更新的情况[转载]

    我们有时候常碰到vue中明明修改了数据,但是视图无法更新,因此我总结了一点点碰到此类的情况: 1.v-for遍历的数组,当数组内容使用的是arr[0].xx =xx更改数据,vue无法监测到 数组数据 ...

  4. 深度学习原理与框架-卷积网络细节-图像分类与图像位置回归任务 1.模型加载 2.串接新的全连接层 3.使用SGD梯度对参数更新 4.模型结果测试 5.各个模型效果对比

    对于图像的目标检测任务:通常分为目标的类别检测和目标的位置检测 目标的类别检测使用的指标:准确率, 预测的结果是类别值,即cat 目标的位置检测使用的指标:欧式距离,预测的结果是(x, y, w, h ...

  5. js修改table中Td的值(定义td的单击事件)

    /* 页面装载时,为每个td增加单击事件,这样,就可以不用对每个页面进行更改. 添加单击事件属性.此处不可使用setAttribute方法. */ onclick=AddObjOfText; 单击事件 ...

  6. 1047A_Little C Loves 3 I（构造）

    A. Little C Loves 3 I time limit per test 1 second memory limit per test 256 megabytes input standar ...

  7. Linux下查看与修改mtu值

    MTU:通信术语 最大传输单元(Maximum Transmission Unit)是指一种通信协议的某一层上面所能通过的最大数据包大小(以字节为单位). 我们在使用互联网时进行的各种网络操作,都是通 ...

  8. LeetCode OJ 77. Combinations

    题目 Given two integers n and k, return all possible combinations of k numbers out of 1 ... n. For exa ...

  9. Android-json解析：原生JSONObject+JSONArray的使用【转】

    原文地址:https://blog.csdn.net/sinat_31057219/article/details/71518123 一.JSONObject和JSONArray的数据表示形式 JSO ...

  10. UNION 与 UNION ALL的区别

    UNION 操作符用于合并两个或多个 SELECT 语句的结果集. 请注意,列的数量.数据类型.顺序要保持一致!!! 结果集中的列名总是等于 UNION 中第一个 SELECT 语句中的列名. 例子: ...