
Html5
文章平均质量分 78
j20lin
这个作者很懒,什么都没留下…
展开
-
多个div水平横向排列
多个div水平横向排列的方式:1.使用float:2.使用display:line原创 2017-03-27 15:25:07 · 8186 阅读 · 0 评论 -
jQuery学习教程十: jQuery - Chaining动作/方法链接
通过 jQuery,您可以把动作/方法链接起来。Chaining 允许我们在一条语句中允许多个 jQuery 方法(在相同的元素上)。jQuery 方法链接直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条)。不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条。提示:这原创 2017-03-23 14:14:10 · 339 阅读 · 1 评论 -
jQuery学习教程十一: jQuery - 获得内容和属性
jQuery 拥有可操作 HTML 元素和属性的强大方法。jQuery DOM 操作jQuery 中非常重要的部分,就是操作 DOM 的能力。jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。提示:DOM = Document Object Model(文档对象模型)DOM 定义访问 HTML 和 XML原创 2017-03-23 14:34:43 · 341 阅读 · 0 评论 -
jQuery学习教程十二: jQuery - 设置内容和属性
设置内容 - text()、html() 以及 val()我们将使用前一章中的三个相同的方法来设置内容:text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML 标记)val() - 设置或返回表单字段的值下面的例子演示如何通过 text()、html() 以及 val() 方法来设置内容:实例$(d原创 2017-03-23 14:42:30 · 261 阅读 · 0 评论 -
jQuery学习教程十三: jQuery - 添加元素
通过 jQuery,可以很容易地添加新元素/内容。添加新的 HTML 内容我们将学习用于添加新内容的四个 jQuery 方法:append() - 在被选元素的结尾插入内容prepend() - 在被选元素的开头插入内容after() - 在被选元素之后插入内容before() - 在被选元素之前插入内容jQuery append() 方原创 2017-03-23 14:56:56 · 310 阅读 · 0 评论 -
jQuery学习教程十四: jQuery - 删除元素
通过 jQuery,可以很容易地删除已有的 HTML 元素。删除元素/内容如需删除元素和内容,一般可使用以下两个 jQuery 方法:remove() - 删除被选元素(及其子元素)empty() - 从被选元素中删除子元素jQuery remove() 方法jQuery remove() 方法删除被选元素及其子元素。原创 2017-03-23 17:05:58 · 301 阅读 · 0 评论 -
jQuery学习教程十五: jQuery - 获取并设置 CSS 类
通过 jQuery,可以很容易地对 CSS 元素进行操作。jQuery 操作 CSSjQuery 拥有若干进行 CSS 操作的方法。我们将学习下面这些:addClass() - 向被选元素添加一个或多个类removeClass() - 从被选元素删除一个或多个类toggleClass() - 对被选元素进行添加/删除类的切换操作css() - 设置或返回原创 2017-03-23 17:31:15 · 692 阅读 · 0 评论 -
jQuery学习教程十六: jQuery - css() 方法
jQuery css() 方法css() 方法设置或返回被选元素的一个或多个样式属性。返回 CSS 属性如需返回指定的 CSS 属性的值,请使用如下语法:css("propertyname");下面的例子将返回首个匹配元素的 background-color 值:实例$(document).ready(functio原创 2017-03-24 10:00:08 · 371 阅读 · 0 评论 -
jQuery学习教程十七: jQuery - 尺寸
通过 jQuery,很容易处理元素和浏览器窗口的尺寸。jQuery 尺寸 方法jQuery 提供多个处理尺寸的重要方法:width()height()innerWidth()innerHeight()outerWidth()outerHeight()jQuery width() 和 height() 方法width() 方法设转载 2017-03-24 10:05:46 · 352 阅读 · 0 评论 -
jQuery学习教程十八: jQuery 遍历
什么是遍历?jQuery 遍历,意为“移动”,用于根据其相对于其他元素的关系来“查找”(或选取)HTML 元素。以某项选择开始,并沿着这个选择移动,直到抵达您期望的元素为止。下图展示了一个家族树。通过 jQuery 遍历,您能够从被选(当前的)元素开始,轻松地在家族树中向上移动(祖先),向下移动(子孙),水平移动(同胞)。这种移动被称为对 DOM 进行遍历。图示解释:原创 2017-03-24 10:59:17 · 607 阅读 · 0 评论 -
jQuery学习教程十九: jQuery 遍历 - 祖先
祖先是父、祖父或曾祖父等等。通过 jQuery,您能够向上遍历 DOM 树,以查找元素的祖先。向上遍历 DOM 树这些 jQuery 方法很有用,它们用于向上遍历 DOM 树:parent()parents()parentsUntil()jQuery parent() 方法parent() 方法返回被选元素的直接父元素。原创 2017-03-24 14:12:44 · 476 阅读 · 0 评论 -
jQuery学习教程二十: jQuery 遍历 - 后代
后代是子、孙、曾孙等等。通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代。向下遍历 DOM 树下面是两个用于向下遍历 DOM 树的 jQuery 方法:children()find()jQuery children() 方法children() 方法返回被选元素的所有直接子元素。该方法只会向下一级对 D转载 2017-03-24 14:47:55 · 560 阅读 · 0 评论 -
jQuery学习教程二十一: jQuery 遍历 - 同胞
同胞拥有相同的父元素。通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素。在 DOM 树中水平遍历有许多有用的方法让我们在 DOM 树进行水平遍历:siblings()next()nextAll()nextUntil()prev()prevAll()prevUntil()jQuery siblings() 方法sib转载 2017-03-24 15:37:10 · 514 阅读 · 0 评论 -
jQuery学习教程二十二: jQuery 遍历 - 过滤 first,last,eq
缩写搜索元素的范围三个最基本的过滤方法是:first(), last() 和 eq(),它们允许您基于其在一组元素中的位置来选择一个特定的元素。其他过滤方法,比如 filter() 和 not() 允许您选取匹配或不匹配某项指定标准的元素。jQuery first() 方法first() 方法返回被选元素的首个元素。下面的例子选取首个 元素转载 2017-03-24 15:49:45 · 381 阅读 · 0 评论 -
jQuery学习教程二十三: jQuery - AJAX 简介
AJAX 是与服务器交换数据的艺术,它在不重载全部页面的情况下,实现了对部分网页的更新。jQuery AJAX 实例请点击下面的按钮,通过 jQuery AJAX 改变这段文本。$(document).ready(function(){ $("#btn1").click(function(){ $('#test').load('/exam原创 2017-03-24 16:29:52 · 343 阅读 · 0 评论 -
jQuery学习教程二十四: jQuery - AJAX load() 方法
jQuery load() 方法jQuery load() 方法是简单但强大的 AJAX 方法。load() 方法从服务器加载数据,并把返回的数据放入被选元素中。语法:$(selector).load(URL,data,callback);必需的 URL 参数规定您希望加载的 URL。可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。原创 2017-03-24 16:37:24 · 400 阅读 · 0 评论 -
jQuery学习教程二十五: jQuery - AJAX get() 和 post() 方法
jQuery get() 和 post() 方法用于通过 HTTP GET 或 POST 请求从服务器请求数据。HTTP 请求:GET vs. POST两种在客户端和服务器端进行请求-响应的常用方法是:GET 和 POST。GET - 从指定的资源请求数据POST - 向指定的资源提交要处理的数据GET 基本上用于从服务器获得(取回)数据。注释:原创 2017-03-24 16:58:12 · 386 阅读 · 0 评论 -
jQuery学习教程九: jQuery Callback 函数
Callback 函数在当前动画 100% 完成之后执行。jQuery 动画的问题许多 jQuery 函数涉及动画。这些函数也许会将 speed 或 duration 作为可选参数。例子:$("p").hide("slow")speed 或 duration 参数可以设置许多不同的值,比如 "slow", "fast", "normal" 或毫秒原创 2017-03-23 11:38:02 · 227 阅读 · 0 评论 -
jQuery学习教程八: jQuery 停止动画stop
jQuery stop() 方法用于在动画或效果完成前对它们进行停止。实例jQuery stop() 滑动演示 jQuery stop() 方法。 $(document).ready(function(){ $("#flip").click(function(){ $("#panel").slideDown(5000); }); $原创 2017-03-23 11:23:34 · 480 阅读 · 0 评论 -
CSS overflow 属性
实例设置 overflow 属性:div {background-color:#00FFFF;width:150px;height:150px;overflow: scroll}如果元素中的内容超出了给定的宽度和高度属性,overflow 属性可以确定是否显示滚动条等行为。这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否原创 2017-03-27 16:03:41 · 480 阅读 · 0 评论 -
html的text里文字过长裁剪显示
实例使用 text-overflow 属性: div.test{white-space:nowrap; width:12em; overflow:hidden; border:1px solid #000000;}下面两个 div 包含无法在框中容纳的长文本。正如您所见,文本被修剪了。这个 div 使用 "text-overflow:ellipsi原创 2017-03-27 16:09:44 · 1929 阅读 · 0 评论 -
CSS display 属性
实例使段落生出行内框:p {display: inline}div {display: none}本例中的样式表把段落元素设置为内联元素。而 div 元素不会显示出来!div 元素的内容不会显示出来!定义和用法display 属性规定元素应该生成的框的类型。说明这个属性用于定义建立布局时元素生成的显示框类型。对原创 2017-03-27 16:25:47 · 550 阅读 · 0 评论 -
CSS float 属性
实例把图像向右浮动:img {float:right}在下面的段落中,我们添加了一个样式为 float:right 的图像。结果是这个图像会浮动到段落的右侧。This is some text. This is some text. This is some text.This is some text. This is some text. This原创 2017-03-27 16:36:35 · 440 阅读 · 0 评论 -
html 元素显示边框
实例设置 4 个边框的样式:p {border: medium double rgb(250,0,255)}Some text定义和用法border 简写属性在一个声明设置所有的边框属性。可以按顺序设置如下属性:border-widthborder-styleborder-color如果不设置其中的某个值,也不会原创 2017-03-27 17:02:34 · 3762 阅读 · 0 评论 -
html css 设置元素圆角边框
实例向 div 元素添加圆角边框: div{text-align:center;border:2px solid #a1a1a1;padding:10px 40px; background:#dddddd;width:350px;border-radius:25px;-moz-border-radius:25px; /* 老的 Firefox */}原创 2017-03-27 17:11:34 · 4944 阅读 · 0 评论 -
html css 绝对位置absolute和相对位置relative
实例定位 h2 元素:h2.pos_abs{position:absolute;left:100px;top:150px}这是带有绝对定位的标题通过绝对定位,元素可以放置到页面上的任何位置。下面的标题距离页面左侧 100px,距离页面顶部 150px。定义和用法position 属性规定元素的定位类型。说明这个属性原创 2017-03-27 17:56:22 · 963 阅读 · 0 评论 -
CSS 相对定位和绝对位置
设置为相对定位的元素框会偏移某个距离。元素仍然保持其未定位前的形状,它原本所占的空间仍保留。CSS 相对定位相对定位是一个非常容易掌握的概念。如果对一个元素进行相对定位,它将出现在它所在的位置上。然后,可以通过设置垂直或水平位置,让这个元素“相对于”它的起点进行移动。如果将 top 设置为 20px,那么框将在原位置顶部下面 20 像素的地方。如果 left 设原创 2017-03-28 16:53:42 · 2234 阅读 · 0 评论 -
CSS margin 属性
实例设置 p 元素的 4 个外边距:p.margin {margin: 2cm 4cm 3cm 4cm}这个段落没有指定外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落没有指定外边距。定义和用法margin 简写属性在一个声明中设置所原创 2017-03-28 17:12:24 · 355 阅读 · 0 评论 -
jQuery学习教程二:jQuery选择器
jQuery 选择器在前面的章节中,我们展示了一些有关如何选取 HTML 元素的实例。关键点是学习 jQuery 选择器是如何准确地选取您希望应用效果的元素。jQuery 元素选择器和属性选择器允许您通过标签名、属性名或内容对 HTML 元素进行选择。选择器允许您对 HTML 元素组或单个元素进行操作。在 HTML DOM 术语中:选择器允许您对原创 2017-03-22 10:30:22 · 317 阅读 · 0 评论 -
jQuery学习教程三:jQuery 事件
jQuery 是为事件处理特别设计的。jQuery 事件函数jQuery 事件处理方法是 jQuery 中的核心函数。事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语由事件“触发”(或“激发”)经常会被使用。通常会把 jQuery 代码放到 部分的事件处理方法中:实例$(document)原创 2017-03-22 10:59:44 · 286 阅读 · 0 评论 -
jQuery学习教程一: jQuery语法实例
jQuery 语法jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。基础语法是:$(selector).action()美元符号定义 jQuery选择符(selector)“查询”和“查找” HTML 元素jQuery 的 action() 执行对元素的操作示例$(this).hide() - 隐藏当前元素$原创 2017-03-22 09:50:26 · 301 阅读 · 0 评论 -
jQuery学习教程四:jQuery 效果 - 隐藏和显示
效果演示点击这里,隐藏/显示面板实例jQuery hide()演示一个简单的 jQuery hide() 方法。$(document).ready(function(){ $("p").click(function(){ $(this).hide(); });});如果您点击我,我会消失。点击我,我会消失。也要点击我哦。原创 2017-03-22 11:32:10 · 778 阅读 · 0 评论 -
jQuery学习教程五:jQuery 效果 - 淡入淡出, Fading 方法
实例jQuery fadeIn()演示 jQuery fadeIn() 方法。$(document).ready(function(){ $("button").click(function(){ $("#div1").fadeIn(); $("#div2").fadeIn("slow"); $("#div3").fadeIn(3000原创 2017-03-22 14:55:37 · 502 阅读 · 0 评论 -
jQuery学习教程六: jQuery 效果 - 滑动 slide
实例jQuery slideDown()演示 jQuery slideDown() 方法。 $(document).ready(function(){ $(".flip").click(function(){ $(".panel").slideDown("slow"); });}); div.panel,p.flip{margin:0px;pad原创 2017-03-22 15:24:29 · 687 阅读 · 0 评论 -
jQuery学习教程七: jQuery 效果 - 动画 animate
jQuery animate() 方法允许您创建自定义的动画。jQuery 动画 - animate() 方法jQuery animate() 方法用于创建自定义动画。语法:$(selector).animate({params},speed,callback);必需的 params 参数定义形成动画的 CSS 属性。可选原创 2017-03-23 11:05:27 · 476 阅读 · 0 评论 -
H5 页面适配所有 iPhone 和安卓机型的六个技巧
目前,很多APP设计师小伙伴已经开始转向H5前端开发啦,但是解决所有iPhone和安卓机型的适配问题是我们的重中之重。无论是设计APP还是写前端H5.都是要考虑移动端的兼容性。25学堂今天跟大家来回顾一下H5页面去适配所有iPhone和安卓机型的一些技巧和办法。回归正题,兼容iphone各版本机型最佳的方式就是自适应。1、viewport 简单粗暴的方式:nam转载 2017-05-09 11:24:09 · 1007 阅读 · 0 评论