知识点一:

HTML5的标准结构:

<!DOCTYPE html>
<html lang='en'>
<head>
<meat charset='utf-8'>
<title>Document</title>
</head>
<body>
</body>
</html>

meta的其他示例: 
关键字:将网页内容提出关键字告诉搜索引擎,利于seo排名,content的内容用”,”隔开。

<meta name='keywords' content=''>

网页描述:用于检索出来的网页描述使用。用于seo查看。

<meta name='description' content=''> 

网页重定向:实现域名跳跃,即可以注册多个域名,然后跳到同一个域名即可。

<meta http-equiv='refresh' content='5;http://www.baidu.com'>

link标签: 
链接外部样式表文件:

<link rel='stylesheet' href=''>

设置icon图标:

<link rel='icon' href=''>

知识点二:表格:

标准结构:

<table border='' width='' height='' cellspacing='' cellpadding='' align='' bgcolor=''>
<thead>
<tr>
<td>姓名</td>
<td>年龄</td>
</tr>
</thead>
<tbody>
<tr>
<td>赵灵儿</td>
<td>18</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>林月如</td>
<td>18</td>
</tr>
</tfoot>
</table>

属性: 
border:边框粗细。 
width:表格宽度。 
height:高度。 
cellspacing:单元格与单元格的距离 
cellpadding:内容距边框的距离 
align:left、right、center表格的排列方式,居左,居右,居中。 
bgcolor:背景颜色。 
属性rowsapn:合并同一列上的单元格。 
属性colspan:合并同一行上的单元格。 
表格标题:<th></th>用法跟<td></td>一样 
边框颜色:属性bordercolor 
内容垂直对齐:<td>属性valign=top、middle、bottom。

知识点三:表单

表单域:

<form action='' method=''> 

action:处理方式,其实就是访问地址。 
method:get/post 
文本输入框:

<input type='text' maxlength='' readonly='readonly' disable='disable' name='username' value='内容'>

maxlength=”6” 限制输入字符长度 
readonly=”readonly” 将输入框设置为只读状态(不能编辑) 
disabled=”disabled” 输入框未激活状态 
name=”username” 输入框的名称 
value=”内容” 将输入框的内容传给处理文件

密码输入框:属性同文本输入框一致。

<input type='password' name='password'>

单选框:只有当name相同时,才能实现单选效果。 checked属性为默认选中。

<input type='radio' name='gender' checked='checked'>男
<input type='radio' name='gender' >女

下拉框:

<select multiple='multiple'>
<optgroup label='北京市'>
<option>昌平区</option>
<option>海淀区</option>
<option>朝阳区</option>
<option selected='selected'>大兴区</option>
</optgroup>
</select>

Multiple=”multiple” 将下拉列表设置为多选项 
Selected=”selected” 设置默认选中项目 
<optgroup></optgroup> 对下拉列表进行分组。 
Label=”” 分组名称。

多选框:checked表示默认选中。

<input type='checkbox' checked='checked'>多选1
<input type='checkbox' >多选2
<input type='checkbox' >多选3

多行文本框:

cols:控制输入字符的长度。 
rows:控制输入字符的行数。

<textarea cols='130' rows='10'></textarea>

文件上传控件:

<input type='file'>

提交按钮:可以直接实现提交

<input type='submit'>

普通按钮:没有功能,需要配合js使用

<input type='button' >

重置按钮:可以重置表单信息

<input type='reset'>

图片按钮:图片按钮也可以实现信息提交功能。

<input type='image' src=''>

给表单实现分组:

对表单信息分组 
表单信息分组名称

<fieldset></fieldset>
<legend>分组信息<legend>

知识点四:标签语义化:

好的语义化的网站标准就是去掉样式表文件之后,结构依然很清晰。 
标签语义化概念:根据内容的结构化(内容语义化),选择合适的标签(代码语义化)

-标签语义化意义: 
1:网页结构合理 
2:有利于seo:和搜索引擎建立良好沟通,有了良好的结构和语 义你的网页内容自然容易被搜索引擎抓取; 
3:方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备) 
4:便于团队开发和维护

1:尽可能少的使用无语义的标签div和span;

2:在语义不明显时,既可以使用div或者p时,尽量用p, 因为p在默认情况下有上下间距,对兼容特殊终端有利;

3:不要使用纯样式标签,如:b、font、u等,改用css设置。

4:需要强调的文本,可以包含在strong或者em标签中strong默认样式是加粗(不要用b),em是斜体(不用i);

HTML基础下的更多相关文章

  1. 【Xamarin开发 Android 系列 7】 Android 结构基础(下)

    原文:[Xamarin开发 Android 系列 7] Android 结构基础(下) *******前期我们不打算进行太深入的东西,省的吓跑刚进门的,感觉门槛高,so,我们一开始就是跑马灯一样,向前 ...

  2. 黑马程序员+ADO.Net基础(下)

    ---------------<a href="http://edu.csdn.net"target="blank">ASP.Net+Android ...

  3. 《转》python学习--基础下

    转自http://www.cnblogs.com/BeginMan/archive/2013/04/12/3016323.html 一.数字 在看<Python 核心编程>的时候,我就有点 ...

  4. Python基础 (下)

    参考:菜鸟教程 目录 一.读写文件 二.错误和异常 三.XML和JSON解析 四.类 五.Python高级教程 一.读写文件 1. 打开文件:  open(filename, mode). mode有 ...

  5. Kinect for Windows SDK开发入门(七):骨骼追踪基础 下

    http://www.cnblogs.com/yangecnu/archive/2012/04/09/KinectSDK_Skeleton_Tracking_Part2.html 上一篇文章用在UI界 ...

  6. 《转》python基础下

    转自http://www.cnblogs.com/BeginMan/archive/2013/04/12/3016323.html 一.数字 在看<Python 核心编程>的时候,我就有点 ...

  7. 黑马程序员+SQL基础(下)

    ---------------------- <a href="http://edu.csdn.net"target="blank">ASP.Net ...

  8. Servlet基础(下)

    10.Servlet定义初始化参数必须使用web.xml中的init-param/para-name和 para-value元素;11.ServletConfig对象的getInitParameter ...

  9. Unix环境编程基础下

    Unix出错处理 当UNIX系统的函数出错时,通常会返回一个负值.我们判断函数的返回值小于0表示出错了,注意我们并不知道为什么出错.例如我们open一个文件,返回值-1表示打开失败,但是为什么打开失败 ...

  10. 面试题(二)—Java基础(下)

    一.进程和线程 进程 (1)正在运行的程序,是系统进行资源分配和调用的独立单位. (2)每一个进程都有它自己的内存空间和系统资源. 线程 (1)是进程中的一条执行路径. (2)一个进程如果只有一条执行 ...

随机推荐

  1. 图论 Warshall 和Floyd 矩阵传递闭包

    首先我们先说下图论,一般图存储可以使用邻接矩阵,或邻接表,一般使用邻接矩阵在稠密图比较省空间. 我们来说下有向图,一般的有向图也是图,图可以分为稠密图,稀疏图,那么从意思上,稠密图就是点的边比较多,稀 ...

  2. Python学习笔记(十)

    Python学习笔记(十): 装饰器的应用 列表生成式 生成器 迭代器 模块:time,random 1. 装饰器的应用-登陆练习 login_status = False # 定义登陆状态 def ...

  3. asp.net C# 实现阿里大鱼和云片网短信接口类

    云片网短信通用类 public class YunpianSMS { public YunpianSMS() { } /// <summary> /// 服务器HTTP地址 /// < ...

  4. 64、django之模型层(model)--建表、查询、删除基础

    要说一个项目最重要的部分是什么那铁定数据了,也就是数据库,这篇就开始带大家走进django关于模型层model的使用,model主要就是操纵数据库不使用sql语句的情况下完成数据库的增删改查.本篇仅带 ...

  5. 为什么国外的 App 很少会有开屏广告?

    前言: 笔者在知乎看到这个问题,觉得这的确是一个值得关注和回答的现象,遂写了回答并整理成本文发布在此抛砖引玉,欢迎讨论. 正文: 古话说得好,先问是不是,再问为什么. 对于「国外的 App 很少有开屏 ...

  6. BandwagonHost搬瓦工VPS自建

    地址:https://bwh1.net/aff.php?aff=18648 ,购买$2.99的就够用了(现在没有$2.99的了,最低是$4.99) 步骤一: 步骤二: 步骤三:选图中的选项,然后点 A ...

  7. python函数说明内容格式错误

    def levlTwo(levloneList,levlOneNum): """ 入参levloneList 一级城市列表 入参levlOneNum 用户选择的城市序号 ...

  8. OpenCV4Android背景建模(MOG、MOG2)

    本文为作者原创,转载请注明出处(http://www.cnblogs.com/mar-q/)by 负赑屃     很久以前的笔记了,分享给大家吧...OpenCV4Android中用于背景建模的类主要 ...

  9. Java基础笔记9

    super关键字 表示父类对象. 1.可以调用父类中被重写的方法. 2.还有调用父类中的构造方法.放在子类构造方法的第一行. 不能和this关键字同时出现. final关键字 1.修饰属性.表示常量. ...

  10. [转载]ACM搜索算法总结(总结)

    原文地址:ACM搜索算法总结(总结)作者:GreenHand 搜索是ACM竞赛中的常见算法,本文的主要内容就是分析它的 特点,以及在实际问题中如何合理的选择搜索方法,提高效率.文章的第一部分首先分析了 ...