swiper h5学习 - 相关文章

H5学习的第三周

上周,我们结束了京东站的制作,本周我们开始了手机站和响应式网站的学习,并仿制了一个手机端界面和一个响应式界面,在完成这两个网站的过程中我遇到了许多问题,也了解了它们的解决方法,接下来我讲详细介绍本周我们的学习内容. 周一,我们了解了像素之间的关系,具体为: 1.设备物理像素:设备上的一个像素点. 2.设备无关像素:可以与物理像素通过dpr转换.(dpr为1时无关像素=物理像素.) 3.css像素:css中使用的的抽象概念,页面没有缩放时,css像素=无关像素. 和视口viewport 的概念:…

H5学习第二周

怎么说,在各种感觉中h5学习的第二周已经过来了,先总结一下,感觉学习h5是一件让我爱恨交加的事,学会一些新的知识并把它成功运行出来的时候是非常激动和兴奋的,但是有时候搞不懂一个标签或者属性的时候,就有了把电脑砸了的冲动!!!!!!额...好吧,再纠结也并没有什么卵用.还是把这周的总结感悟写一下吧. 这周主要接触的H5知识有CSS盒子模型,浮动与定位,HTML的新增结构标签,[html5]表单新增结构标签,以及CSS过渡和动画. 下面讲一下盒子模型和定位 1.CSS盒子模型在CSS的学习中,盒模…

H5学习笔记1

H5学习笔记 1.创建超链接: target=”_blank”:链接的目标网页会在新的窗口中打开. target=”_parent”:链接的目标会在当前窗口中打开,如果在框架网页中,则会在上一层框架打开目标网页. target=”_self”:链接的目标会在当前运行的窗口中打开,这是默认值. target=”_top”:链接的目标会在浏览器窗口打开,如果有框架的话,网页中的所有框架也会被删除. target=”_窗体名称”:链接的目标会在有指定名称的窗口或框架中打开. 2.<p></p&…

2017.3.12 H5学习的第一周

本周我开始了H5的学习,在这一周里我们从html的基本标签开始一直讲到了才算css的用法,接下来我将记录下来本周我学到的H5的内容. 首先是声明文档,声明文档类型是HTML5文件,它在HTML文档必不可少且必须放在文档第一行. 写法:<!DOCTYPE html>. 接着我们学习了html的基本结构: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title&…

H5学习第一周

已经接触H5一个周了,经过学习,总算对H5有了一些了解和认知,下面就总结一下我对H5的认知和感悟. 首先接触的是H5的常用标签[meta],它有其以下常用属性 1.charset属性.单独使用,设置文档字符集编码格式,写法<meta charset="UTF-8">,常见的编码格式有GB-2312,GBK,UTF-8等 2.http-equiv属性.需配合content属性使用,主要声明浏览器如何解释编译文 3.name属性,需配合content属性使用,主要给搜索引擎提…

H5学习之--前端和PHP后端的简单交互

最近在学习前端的东西,H5+CSS3+JS,又分别学习了原生JS和jQuery库,还有Bootstrap框架,因为我是做ios开发的,所以先熟悉WebApp相关的开发知识,其他的学习资料,网上有很多的学习资料,学到交互这块了,简单做个记录! 代码如下: 1,导入jQuery和Bootstrap,不过就简单写了点东西,所以没有用到Bootstrap,我随便导入了个CDN,不过公司的前端开发说,他们一般是把jQuery和Bootstrap下载一个版本,放到服务器上,这样访问速度快,不连网的情况下,不…

移动开发之h5学习大纲

移动开发学习形式:授课.自学 1.html5 css3 htm5shiv.js response.js 2.流式布局自适应布局盒模型弹性盒模型响应式布局3.iscroll swiper bootstrap animate.css zepto.js4.jquery mobile.jquery ui.EasyUI.amazeui.Sencha Touch .select3.frozenui5.echart hcharts图表地图达成效果的方法有无数种..重要的是哪种方法效果更好,更方便标…

H5学习

1.html{font-size:62.5%;}//不用font-size:10px的原因:(因为设了62.5%后就有1rem = 10px,便于用rem来指定元素的尺寸,这样响应式的时候可以直接改变font-size而无需计算其他各种样式中出现的尺寸了. 用rem定义尺寸的另一个好处是更能适应缩放/浏览器设置字体尺寸等情况(因为rem相对于字体大小,会同步改变). 至于选择62.5%而非10px的原因,主要是兼容性和未来发展趋势的综合考虑,px这个单位的含义已经越来越混乱,几乎无法评估以后的设…

H5学习系列之Geolocation API

获取位置信息途径: 1.IP地址地理定位数据 2.GPS地理定位数据 3.WI-FI地理定位数据 4.手机地理定位数据无废话直接上重点:navigator.geolocation对象就是获取地理位置信息的关键(目前由于中国大陆防火墙问题,谷歌浏览器无法提供位置服务) 浏览器获取用户位置信息(属于隐私信息),必须首先通过用户同意. 检测浏览器是否支持H5的方法 if(navigator.geolocation){}else {} 单次请求: navigator.geolocation.getC…

H5学习系列之Audio和Video

1.视频文件:音频轨道.视频轨道和一些元数据(视频封面.标题.子标题.字幕等相关信息). 2.目前H5还不支持的:流式音频和视频(H5对视频的支持只限于加载的全部媒体文件).H5的媒体收到跨域资源共享的限制.全屏无法通过脚本控制. 3.检测浏览器是否具有播放视频的功能 var canPlay = document.createElement("video").canPlayType; if (canPlay) {alert("ok");} else {alert('…

H5学习小结——div+css创建电子商务静态网页

使用Sublime Text软件编写电子商务类网站静态形式首页经过差不多一星期的学习,基本掌握了div+css的用法之后,开始了实战练习.首先要做的就是要练习一下一般电子商务网页的编写,我做的是下图效果的网页,是一个关于台湾特产的网页.如图: 拿到图片之后,首先要分析一下整个网页的结构,上图所示的网页稍微分析一下就可以看出具体分为四个部分,为头部header,中间的广告ad_img,中间的主体内容main和底部的footer,当然具体的还可以分成很多部分,这里主要看个人的习惯,所以在…

H5学习第四周

本周.我们结束了HTML标签和css样式部分,开始了JS的学习.JS是的内容和css,html基本上没有什么联系而且它比较需要逻辑思考能力,所以要从新开始学习. 使用js的三种方式: 1.html标签中内嵌js(不提倡使用): <button onclick="javascript:alert('qoqoqoq')">kkkkkkkkkkkkkkkkkkkkkkk</button> 2.html页面中直接使用js: <script type="t…

H5学习之旅-H5的基本标签（2）

H5的标签和html的标签没什么区别,主要介绍H5的基本标签 1.基础标签header和body,header的<title>元素主要是显示在标签页面里面,以及设置使用的语言和编码格式.body是正文部分 2.H5的标题是h1-h6,逐渐变小 3.html的段落是标签p 4.html的超链接是a标签.eg:百度一下 5.html插入图像 eg: 代码实例 <!DOCTYPE html> <html lang="en"> <head> &l…

H5学习之旅-H5的新特性（1）

随着H5的发展,网页开发呈现了跨平台的特性,目前H5是兼容各大平台的,这也为一些其他的技术的跨平台开发提供了基础,所以我预测后H5会成为很重要的开发语言新特性介绍 1.用于回话的canvas标签 2.用于媒介回放的video和audio标签 3.对本地离线存贮的更好支持 4.新的特殊内容标签 :article header footer nav section 5. 新的表单控件:calendar date time url email search 6. Safari Chrome Fire…

H5学习之旅-H5列表（8）

列表的基本语法 ol:有序列表 ul:无序列表 li:列表项 dl:列表 dt:列表项 dd:列表描述常用列表 1.无序列表:使用标签 ul,li 属性:disc(默认实心圆) circle (空心圆)square (方块) 2.有序列表:使用标签ol,li 属性:A(大写字母) a (小写字母)l (大写罗马数字)i (小写罗马数字)start (设置开始阿拉伯数字) 3.混合列表 : 使用标签 ul ol li 4.自定义列表 : 使用标签 dl dt dd !!!!!!代码实例 <!DO…

H5 学习之旅-H5表格（7）

表格语法 table:简历表格 captian:表格标题 th:表格行表头 tr:表格行 td:单元格 thead:表格页眉 tfoot:表格页脚 tbody:表格主体 col:列属性 !!!代码实例带标题的表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>H5表格</title> </hea…

H5学习之旅-H5的超链接以及图片链接（6）

链接内容 1.文本链接 2.图片链接属性 href:指向另一个文档的链接 name:文档内部的链接 img标签属性 alt:替换文本属性 width:宽 height:高代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>H5样式</title> </head> <body&g…

H5学习之旅-H5的样式（5）

样式的引入方式外部样式表 link rel = "stylesheet" type = "text/css" href = "mystyle.css" 内部样式表 style type = "text/css" body { background-color:red} p{margin-left:20px} style 内联样式表 P style = "color:red" 代码实例 <!DOCTY…

H5学习之旅-H5的格式化（4）

H5的格式设置: b代表是粗体 i斜体 big 字体变大 small变小 em强调 strong 加强和变粗差不多 sub 定义下标字 sup 定义上标字 ins 插入字 del 删除字代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>H5 Study</title> </head>…

H5学习之旅-H5的框架（13）

H5框架语法介绍 :frame:框架对于页面的设计有很大的作用 frameSet:框架集标签定义如何将窗口分割为框架 ,每一个frameset定义一些列行或者列,rowS/COLS规定了每行或者每列占据屏幕的面积 noresize:固定框架大小 cols:行比例 rows:列比例 iframe:内联框架代码实例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8…

H5学习之旅-H5与Php交互（12）

1.首先介绍PHP开发环境的搭建 ,在Google搜apachefriends,会有xampp的下载链接,这个工具集成了apache的很多服务 2.搭建php的编辑环境,选取eclipse安装php插件,首先install other software,在搜索框里面输入http,然后选取对应版本eclipse的软件库 ,从下面的program language里面选择php 效果图如下 ![这里写图片描述](http://img.blog.csdn.net/20150921112554 一个简单…

H5学习之旅-H5的表单（11）

H5的表单元素 form:表单 input:输入域,type属性可以设置text,password,button等不同的属性 textarea:文本域 lable:控制标签 fieldset:定义域 legend:域的标题 select:选择列表 optgroup:选项组 option:下拉列表中的选项 button:按钮 !!!!!!!!!!代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta…

H5学习之旅-H5的布局（10）

两种实现方式:div和table div实现布局的方式代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>H5布局0</title> <style type="text/css"> body{ margin: 0px;; } #container{ width:10…

H5学习之旅-H5的块标签的使用（9）

块元素的基本语法 1. Html块元素 ,块元素在开始时候通常以新行开始,比如h1,p,ul 2.内联元素,通常不会以新行开始,比如a,b,img 3.html的div元素,div也被称为块元素,其主要作为组合html元素的容器 4.html的span元素,span元素是内联元素,可作为文本的容器 !!!!!!代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF…

h5学习-h5嵌入android中

嵌入Android中的h5界面: 将此页面复制到android项目中的assets目录下边: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> div{ width: 10px; height: 20px; background-color: aquamarin…

h5学习-webstorm工具的激活

这里有个快速激活webstorm的方法:http://jingyan.baidu.com/article/9f63fb919674f2c8400f0e9a.html h5的轮廓工具:https://gsnedders.html5.org/outliner/…

H5 学习笔记（一、关于position定位）

主要是relative与absolute的用法: 1.relative 依据left right top bottom 等属性在正常文档流中脱离位置,即相对于他的正常文档流位置进行移动.两个都为relative的div之间可以使用z-index. 若有父元素则relative定位的层总是相对其最近的父元素,无论其父元素是何种定位. 2.absolute脱离文档流,若无父元素则相对body的左上角进行定位,若有父元素则相对于最近的定位为relative或absolute父元素,这里的父元素不一定是…

H5学习系列之文件读取API--本文转自http://blog.csdn.net/jackfrued/article/details/8967667

HTML5定义了FileReader作为文件API的重要成员用于读取文件,根据W3C的定义,FileReader接口提供了读取文件的方法和包含读取结果的事件模型. FileReader的使用方式非常简单,可以按照如下步骤创建FileReader对象并调用其方法: 1.检测浏览器对FileReader的支持 if(window.FileReader) { var fr = new FileReader(); // add your code here } else { alert("Not sup…

H5学习系列之Communication API

1 .postMessage API 首先介绍一下什么是iframe? 百度百科里这样写道:IFRAME,HTML标签,作用是文档中的文档,或者浮动的框架(FRAME). 我的理解就是网页中的网页. 通常会有如下两个方面的操作:1个就是在iframe里面操作父窗体,另外一种就是当前页面操作iframe里面的元素. ①iframe里的js操作父级窗口的dom iframe里的js要操作父级窗口的dom,必须搞懂几个对象: 1.parent是父窗口(如果窗口是顶级窗口,那么parent==self=…

【swiper h5学习】的更多相关文章