
html5
文章平均质量分 58
Alps1992
我希望自己变得更优秀。
展开
-
html5学习-input标签
html5中对input有了很大的改进首先说下list, datalist和autocomplete看这段代码:1 text: type="text" name="greeting" list="greetings" autocomplete="on">2 id="greetings" style="display:none">3 value原创 2014-03-10 14:02:53 · 1060 阅读 · 0 评论 -
html学习 - javascript事件监听以及addEventListener参数分析
事件监听在Javascript中事件的监听是用来对某些操作做出反应的方法。例如监听一个按钮的pressdown, 或者获取鼠标左键按下时候鼠标的位置。这些都需要使用监听来完成。监听的函数很简单:addEventListener.这里解释一下一个网页的嵌套关系:最外层:window 包含:document 包含:html 包含: body 包含:div等等...addEventL原创 2015-02-15 15:31:16 · 7614 阅读 · 0 评论 -
sublimetext2-emmet ; zencoding进阶…
写个详细使用zen coding(emmet)doctype声明在开始输入“!”或者“html:5"这个是输出html5声明还有html:xt :输出xhtml过渡类型的doctype声明html:xs :输出xhtml1.0严格类型的doctype声明html:xxs :输出xhtml1.1的doctype声明注释ccc:ie6书写规则嵌套元素原创 2014-03-10 14:03:36 · 775 阅读 · 0 评论 -
sublimetext2-插件emmet&zencoding…
在sublime text2下的zec coding插件真的很好用。。现在更名为emmet了,应该是托管在github上了。首先 Ctrl + ~调出命令窗口然后输入1 importurllib2,os;pf='PackageControl.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp)原创 2014-03-10 14:02:55 · 789 阅读 · 0 评论 -
html学习 - 检测浏览器是否支持Canvas
canvas检测Canvas是html5中的新特性,所以并不是在所有浏览器都有很好的支持,在遇到兼容性的时候,每个人用的浏览器不同,防止出现在有些浏览器发生问题,所以在加载页面的时候就需要提前判断浏览器是否支持Canvas.判断的方法其实有很多,Javascript本身可以判断,还有很多开发框架也提供了判断的canvas的方法。html代码首先我们的html代码是需要有canvas的标签的。<!DO原创 2015-02-21 18:30:15 · 7673 阅读 · 0 评论 -
html学习 - javascript获取一个范围内的随机数
在平时的编程语言中,都会有一个自带的random随机函数,用来模拟求的一个随机数但是在Javascript中虽然有random()函数,但是使用方法不同。因为Javascript中调用random的时候如下方法:Math.random()这样就是调用了。 但是random返回的不是整形范围内的随机数了,而是一个0 ~ 1.0之间的随机浮点数。所以假如我们要求原创 2015-02-13 00:07:06 · 5015 阅读 · 0 评论 -
html学习 - jquery事件监听详解
html学习 - jquery事件监听详解html学习 - jquery事件监听详解监听方法监听方法参数解释click参数事件自动执行问题解决bind方法live方法监听方法在jquery里,监听的方法比较多,用的最多的就是简单的.click() .onchange() .pressdown() 所以这样很简单啊,直接使用就好了,只要符合参数规范就可以了。除了这个还有bind() liv原创 2015-02-16 12:05:25 · 13163 阅读 · 1 评论 -
html学习 - Javascript设置和获取cookies
CookiesCookie,有时也用其复数形式Cookies,指某些网站为了辨别用户身份、进行session跟踪而储存在用户本地终端上的数据(通常经过加密)。Cookies设置我也是才学不久的Cookies。所以先写些简单的。Cookies设置比较简单,通常情况下,每个域名都有自己单独的Cookies,用来保存一些简单数据和用户的登录状态等。Cookies是本地保存原创 2015-02-14 17:48:35 · 3720 阅读 · 0 评论 -
html5学习-CSS3-选择器
在CSS3中有各种结构性伪类选择器,至于为什么叫这个名字我也没弄明白呢,还有各种UI元素状态伪类选择器。其中有四种用法:[att = val] 等于么。。[att *= val] 这个是att包含val这个字符串[att ^= val] 这个是att以val开头的att $= val] 这个是以val结尾的att在结构性伪类选择器中有:root/not/empty/原创 2014-03-10 14:03:04 · 1110 阅读 · 0 评论 -
html学习 - 自动跳转与自动刷新
自动刷新其实自动刷新和跳转没啥区别,刷新就是跳转到本地址。 有几种办法,首先是直接在html的<head>标签里添加下面的代码。html代码代码都放在<head>标签里。//每两秒刷新一次<meta http-equiv="refresh" content="2">//2s后跳转到百度<meta http-equiv="refresh" content="2; url=www.baidu.com"原创 2015-03-13 17:25:37 · 3348 阅读 · 0 评论 -
html学习 - canvas拉伸问题
最近画图,需要根据用户的输入来动态更改画布大小。 但是用js改变完画布大小后发现图形都被拉伸了。想了半天没弄懂,然后搜索了下解决办法。原来是不允许随便用js来控制canvas的长宽。 canvas的默认长宽是 300 * 150.不拉伸的解决办法:var theCanvas = document.getElementById("canvasId");theCanvas.width = 50原创 2015-04-19 03:33:21 · 6127 阅读 · 1 评论 -
html学习 - 元素隐藏/显示和input隐藏
元素隐藏在html中我们经常需要把某些元素隐藏起来,有时候我们需要临时隐藏页面,让其他元素显示,来完成操作。有时候有些信息我们需要传给js,但是又不想给用户看,所以也会隐藏起来。display/visibility方法在html中有这两个方法都可以隐藏元素。先上一段html代码,然后进行操作。html代码<!DOCTYPE html> <head> <title>alie原创 2015-04-07 12:29:24 · 14090 阅读 · 0 评论 -
jquery学习 - jquery选择孩子元素和个数/获取css属性
选择器选择孩子元素和css属性获得孩子元素的个数选择器jquery的选择器很强大,可以的话,能用jquery的时候,真的是非常方便。选择孩子元素和css属性先看下面的代码:SelectColor = $(ColorId).children('svg').children('rect').css('fill');这个代码很容易懂。首先: ColorId = $(“#id”); svg是一原创 2015-04-13 16:11:04 · 4479 阅读 · 0 评论 -
html学习 - SVG下动态添加元素
正常情况下,我们在一个页面添加一个元素的时候,非常简单,尤其是使用jquery的情况下。例如下面代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Page</title></head><body> <div id="page"> </div> <div id="p原创 2015-05-19 22:45:26 · 6780 阅读 · 0 评论 -
jquery获取Url和JS获取Url的参数值
jquery获取url的值很简单:window.location.href然后JS获取url参数的话 function getUrlParam (name) { var reg = new RegExp("(^|&)"+name+"=([^&*])(&|$)"); var r = window.location.search.substr(1).match(reg);原创 2014-03-30 23:24:53 · 1813 阅读 · 0 评论 -
Ajax学习-后台输出json然后js遍历j…
后台输出json:1 $arr= array('0'=>array('id'=>'11', 'title'=>112),'2'=>array('id'=>33, 'title'=>44));2 echo json_encode($arr);我一般在后台返回的数据都转换成数组返回,好像也可以用Object返回,当然没有试过,其实我觉得XML能同样达到目的,不过json原创 2014-03-10 14:04:19 · 1185 阅读 · 0 评论 -
html5-CSS学习-background记录
为了提高点效率,写个博客睡觉~这次是background的解释首先:可以这个样子来设置背景:background: #00ff00 url(images url) no-repeat fixed top;这样子就一下全都设置了啊,当然也可以分开设置:1 background-image: url(image url);2 background-repeat: no-repea原创 2014-03-10 14:02:59 · 776 阅读 · 0 评论 -
html5学习-CSS3-border-image属性
在CSS3中 border-image属性是规定包围div元素的边框,有空再解释下div元素大致呢,我可以这样字设置:1 div2 {3 -webkit-border-image:url(border.png) round; 4 -o-border-image:url(border.png) round; 5 border-image:url(border.pn原创 2014-03-10 14:03:02 · 1070 阅读 · 0 评论 -
html5学习-CSS3-选择器插入对象
利用CSS3的选择器可以准确的插入你想要插入的东东首先最基本的是插入文字,利用 content:来实现,不多说直接上代码:这个是插入文字的代码,效果图如下这个就是效果图了,假如我有三个h2标签,但是我在第二个标签位置不想插入文字等,那么就指定其属性,content:none;就可以了,但是要指定class或者id都行。然后是插入图片等多媒体类型的东东:代码如下图:这个代码比原创 2014-03-10 14:03:06 · 1024 阅读 · 0 评论 -
html5学习-CSS3-text-shadow/word-…
给文字加阴影其实很简单,就是text-shadow:length length length color;01 style type="text/css">02 div{03 text-shadow: 5px 5px 5px navy,04 10px 10px 10px yellow;05原创 2014-03-10 14:03:08 · 865 阅读 · 0 评论 -
html5学习-CSS-盒的类型
在CSS中用display来定义盒的类型。其中总体来说有block和inline类型两种。例如div和p属于block,而span属于inline。说下区别,inline的宽度等于内容的宽度,而block一行只能放一个block元素,宽度可以指定,而inline元素一行能放多个。看下代码吧。对于block一行只能放一个元素,那么效果就很容易猜到了:因为是用display来定义盒类型原创 2014-03-10 14:03:12 · 899 阅读 · 0 评论 -
html5学习-CSS3-border-image边框…
在div元素中使用图像边框时候需要设置。首先说下:border-image-webkit-border-image-o-border-image这个前面的说的是用的什么浏览器引擎。我一般用chrome,那么就是webkit。然后呢border-image: url() A B C D;这个就是设置边框的四条边的边距就是这四条边在自动分隔的时候所用的边距,ABCD,是上右下左顺原创 2014-03-10 14:03:17 · 1459 阅读 · 0 评论 -
sublimetext2-启动vim模式
Sublime Text2的vim模式很好用不需要我再tab切换位置,反而切换不好了,不用鼠标还是很舒服,而且效率高了很多。打开SublimeText2然后选择:"Preferences: Settings-User"或者:Ctrl+Shift+P调出命令窗口输入setting找到setting-user然后enter就好了假如是里面是空的,没有代码则添加{"ignored_p原创 2014-03-10 14:03:31 · 1536 阅读 · 0 评论 -
sublimetext2-解决中文乱码
sublimetext2在读入文件的时候,因为编码问题会出现中文乱码的情况,一般下插件就可以。先安装package control,在我安装emmet插件里有如何安装然后ctrl+shift+p调出命令输入然后输入install找到install package确定稍等一会出现插件列表,输入ConverToUTF8就可以了,还有个GBK的我一般不用。。然后重启就可以了原创 2014-03-10 14:03:34 · 858 阅读 · 0 评论 -
html5学习-css颜色的16进制表
常设置颜色找不到具体16进制码, 百度来的,放到博客里备份~英文代码 形像颜色 HEX格式 RGB格式LightPink浅粉色#FFB6C1255,182,193Pink粉红#FFC0CB255,192,203Crimson猩红#DC143C220,20,60Lav原创 2014-03-10 14:04:14 · 1948 阅读 · 0 评论 -
Ajax学习-XMLHttpRequest创建,请…
在创建XMLHttpRequest中的时候, 不同浏览器有不同创建方法01 $(document).ready(function() {02 $('input#login_button').click(03 function() {04 // alert("click");05 var username =原创 2014-03-10 14:04:43 · 779 阅读 · 0 评论 -
JQuery学习-获取select标签的值
先贴一段我的代码,再细说:01 $(document).ready(function() {02 var checkText;03 checkText = $('select#cgo_id').find("option:selected").text();04 alert(checkText);05 $('select#cgo_id').cha原创 2014-03-10 14:04:17 · 1003 阅读 · 0 评论 -
html 学习-链接<a>响应(链接…
学习-链接响应(链接不刷新)" TITLE="html 学习-链接响应(链接不刷新)" />这个链接是html的基本组成元素,不解释了。。然后重点说下,除了跳转~~类似:学习-链接响应(链接不刷新)" TITLE="html 学习-链接响应(链接不刷新)" />这样的是基本用法了。然后很多时候其实我们要链接是用来操作界面的。假如我用jquery的hide()来隐藏了一个元素:原创 2014-03-10 14:04:54 · 1118 阅读 · 0 评论 -
html 学习-javascript和jquer…
先说简单的,用jquery最简单。例如:学习-javascript和jquery添加删除html元素" TITLE="html 学习-javascript和jquery添加删除html元素" />这个是html代码,我要删除form表单直接1 $('form').remove();这样就删除了,假如我想在 表单添加一个input1 $('form').append("inpu原创 2014-03-10 14:04:56 · 944 阅读 · 0 评论 -
html5学习 - canvas画图和清除图片
在canvas上画一张图其实很简单,就是用drawImgage函数。定义这里先贴上w3c里的定义和用法:JavaScript 语法 1 (在画布上定位图像:)context.drawImage(img,x,y);JavaScript 语法 2 (在画布上定位图像,并规定图像的宽度和高度:)context.drawImage(img,x,y,width,height);JavaScript原创 2015-06-14 13:03:21 · 26493 阅读 · 0 评论