文档章节

关于html的一些总结

 疯狂菠萝
发布于 2016/06/24 18:43
字数 1402
阅读 11
收藏 0

#html ###元素 1、base:设置相对URL的基础;
2、meta:提供关于文档的信息;
3、noscript:包含浏览器禁用脚本或不支持脚本时显示的内容。 ###划分内容 1、details:生成一个区域,用户将其展开获得更多详细知识;
2、summary:用在details元素中,表示该元素的标题或说明。
3、section:表示一个重要的主题或概念
4、header、footer:表示头部和尾部
5、nav:导航元素
6、hgroup:表示一组标题,其中只有第一个可出现在文档大纲中
7、 ###制表 1、caption:表示表格标题;
2、tr:一行单元格;
3、th:表示标题行单元格;
4、td:表示单元格; ###元素属性 1、target:告诉浏览器如何打开单元格 ###meta元素

<meta name="author" content="Yan de huan">
当前页的作者姓名
<meta name="description" content="myself">
当前页的说明
<meta name="robots" content="noindex">
告诉搜索引擎如何对待该文档,noindex:不要索引本页;noarchive:不要将本页存档或缓存;nofollow:不要顺着本页的链接继续搜索下去;
<meta http-equiv="refresh" content="5;http://www.baidu.com">
该代码作用让浏览器每隔5秒加载www.baidu.com
http-equiv属性的用途是指定所要模拟的标头字段名称,字段值则由content属性指定
meta元素的http-equiv属性允许使用的值
default-style:指定页面优先使用的样式表。对应的content属性值应与同一文档中某个style元素或link元素的title属性值相同;
content-type:这是另一种声明html页面所用字符编码的方法。如:
<meta http-equiv="content-type" content="text/heml charset=UTF-8">

###style 1、style元素的media属性用于确定所使用的设备,例如screen计算机显示屏幕;print打印文档;handheld手持设备 ###link 1、属性rel:说明文档与所关联 资源的关系类型,rel对应的值:

author:链接到文档的作者
help:链接到当前文档的说明文档
alternate:链接到文档的替代版本,比如另一种语言的译本
icon:指定图标资源
license:链接到当前文档的相关许可证
pingback:指定一个回探服务器。从其他网站链接到博客的时候他能自动得到通知
prefetch:预先获取一个资源
stylesheet:载入外部样式表
添加网站标志<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

###script执行顺序

defer:告诉浏览器要等页面载入和解析完毕之后才执行脚本
async:同时加载页面和脚本,异步执行脚本
例子:

<script defer src="...">

###表单

1、form元素的action属性或者button元素的formaction属性:指定表单数据发送到的URL
2、控制表单的自动完成功能:将表单form元素的autocomplete属性设置为禁用,他的值有两种,on和off,其默认值是on,表示允许浏览器填写表单。
3、自动聚焦到某个input元素:添加属性autofocus,例如:

<input autofocus>

4、对表单元素编组,fieldset元素,将input包裹住即可
5、为fieldset元素添加说明标签:legend元素,必须是fieldset元素的第一个子元素
6、使用表单外的元素 ###定制input元素 1、maxlength="Num":设置用户能够输入的字符最大数目;size="Num":设置文本框能够显示的字符数目
2、设置初始值和占位符提示:如果是提示用户输入什么样的数据,那就应该使用placeholder;如果想要提供一个默认值,使用value属性
3、input元素获取数值:

<input type="number" step="1" min="1" max="100" value="1">
step指定上下调节数值的步长;value初始值

4、获取指定范围内的数值

<input type="range" step="1" min="1" max="100" value="1">

5、获取颜色type="color"
6、获取搜索用词type="search"
7、用input元素生成图像按钮和分区相应图

<input type="image" src="accept.png" name="submit">

8、用input上传文件

<input type="file" name="filedata">

###其他表单元素及输入验证

1、optgroup元素可以用来在select元素的内容中建立一定的结构
2、输入验证:required--检查用户是否提供了一个值,如没有提供,则无法提交;使用方法如下:

<input type="text" required>	

3、确保输入值与指定模式匹配--使用pattern属性

<input type="text" pattern="^.*内容.*$">

4、同理确保输入值是邮箱

<input type="text" pattern="^>*@qq.com.*$">

###嵌入内容

1、创建客户端分区相应图--点击某张图像上的不同区域让浏览器导航到不同URL上,关键元素是map

<img src="" usemap="#mymap" alt="">
<map name="#mymap">
	<area href="" shape="" coords="" alt="">
	<area href="" shape="" coords="" alt="">
	<area href="" shape="" coords="" alt="">
</map>
map元素必须包含area元素,area元素的属性分为两类:
一、area所代表的图像区域被用户点击后浏览器导航到的URL;
二、代表不同的图像区域:
  shape属性和coords属性,其中shape属性的值有rect代表矩形,coords属性必须有四个用逗号隔成的整数组成,分别代表:图像的左边缘和矩形的左侧,上上,左右,上下;
  shape属性的值circle代表圆形区域,coords属性必须由3个整数组成,分别是:从图像左边缘到圆心的距离,上边缘到圆心的距离,圆的半径;
  shape属性的值default,这个值的意思是默认区域,shape属性使用这个值是不需要提供coords值

© 著作权归作者所有

共有 人打赏支持
上一篇: css
下一篇: css
粉丝 0
博文 2
码字总数 2490
作品 0
邯郸
程序员
私信 提问
Html常用标记总结

今天下午看了孙鑫老师讲的关于Html的视频,下面我来小小的总结一下自己所学到的内容。 What HTML,超文本标记语言,标准通用标记语言。“超文本”就是指页面内可以包含图片、链接、甚至音乐、...

wxb141001yxx
2017/12/02
0
0
常见Shell命令用法总结

常见命令用法总结 ----- 目录: --- 关于grep的总结 关于egrep的总结 关于tr的总结 关于sort的总结 关于uniq的总结 关于cut的总结 关于tee的总结 关于split的总结 关于type的使用 关于find的...

小骏骏
2016/02/19
62
0
php中关于socket的系列函数总结

php中关于socket的系列函数总结 本文列举了所有关于PHP语言中使用socket相关服务的一些函数。注意使用如下函数之前,你需要确保你的socket已打开,如果你没有打开,请编辑你的php.ini文件,去...

开元中国2015
2015/05/20
61
0
javascript表单之间的数据传递

今天有朋友问我关于用javascript来进行页面各表单之间的数据传递的问题,我以前也写过,不过从来没有注意,今天总结了一下,希望能够给大家一些帮助,也帮助我总结以前学过,用过的知识。 一...

晨曦之光
2012/03/09
57
0
专属于你自己的vim 神器的打造方式

Vim 是一个上古神器,本篇文章主要持续总结使用 Vim 的过程中不得不了解的一些指令和注意事项,以及持续分享一个前端工作者不得不安装的一些插件,而关于 Vim 的简介,主题的选择,以及为何使...

马哥教育
2017/10/30
0
0

没有更多内容

加载失败,请刷新页面

加载更多

AI赋能一键自动检测:页面异常、控件异常、文本异常

摘要: 1.前言 闲鱼质量团队一直致力于交付高质量的app给用户,当前随着AI技术不断发展,TensorFlow大热,也给测试手段带来了更多种可能,本文接下来给大家介绍AI在闲鱼测试的一点实践:如何...

阿里云官方博客
29分钟前
2
0
Microsoft Remote Desktop For Mac

地址:https://rink.hockeyapp.net/apps/5e0c144289a51fca2d3bfa39ce7f2b06/ 解决国内App store不能下载的问题。

Cheuker
40分钟前
1
0
原地打印刷新(倒计时)

原地打印刷新(倒计时) 代码如下 from time import sleepfor i in reversed(range(1, 11)): print("\r倒计时:{}秒".format(i), end="") sleep(1)...

_Change_
53分钟前
1
0
php,vue,vue-ssr 做出来的页面有什么区别?

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由shirishiyue发表于云+社区专栏 目前我这边的web页面,都是采用php+smarty模板生成的,是一种比较早期的开发模式。好处是没...

腾讯云加社区
59分钟前
5
0
安卓的切图规范

Android UI 切图命名规范、标注规范及单位描述 很多UI设计师做APP切图都会有两套,一套是Android的,一套是IOS的。IOS我这边暂不作讲解,因为我本人也不是开发IOS。这里整理一下我在Android...

mo311
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部