html/css
关注
分享
扫一扫
Jinx_Q
这个作者很懒，什么都没留下…
展开
-
关于鼠标悬浮标签元素效果（CSS:cursor属性）
default默认光标（通常是一个箭头）auto默认。浏览器设置的光标。crosshair光标呈现为十字线。pointer光标呈现为指示链接的指针（一只手）/在IE中效果与hand相同，所以hand不是所有浏览器都兼容的move此光标指示某对象可被移动。e-resize此光标指示矩形框的边缘可被向右（东）移动。原创 2014-03-27 11:58:40 · 3121 阅读 · 0 评论 -
移动端html5跳转呼叫程序
<a href="tel:110" >打给110</a>原创 2015-05-28 19:13:40 · 978 阅读 · 0 评论 -
url传递含有参数的参数
原始url： http://ww.baidu.com?appId=id&url=/myUrl?username=name&pwd=pwd 其中斜体部分为一个整体，为url参数的属性； 如何将斜体合并，只需要将斜体部分的&更换为转义符%26即可；那么更新后的url为 http://www.baidu.com?appId=id&url=/myUrl?username=name%26pwd=pwd原创 2015-05-22 13:10:58 · 1698 阅读 · 0 评论 -
解决IE不支持HTML5表单属性placeholder的问题
//解决IE不支持HTML5表单属性placeholder的问题(function ($) { $.fn.placeholder = function (options) { var defaults = { pColor: "#ccc", pActive: "#999", pFont: "14px",原创 2015-05-22 13:50:46 · 1071 阅读 · 0 评论 -
iframe操作父级页面中html元素
html中嵌入一个iframe；现在想在iframe中操作父级html中的元素； 操作如下: 父级html<html> <head></head> <body> <div id="father" >父级html</div> <iframe src="iframe.html"></iframe> </body></html>iframe页面原创 2015-05-22 14:39:11 · 1772 阅读 · 0 评论 -
CSS3之body背景图平铺
你再也不需要因为屏幕大小不同而去选择多张图片作为背景图了，css3教你做人；body{ background: url('xx.jpg')top center no-repeat; background-size:cover;}原创 2015-04-20 13:59:09 · 18176 阅读 · 0 评论 -
html5之Canvas绘制刮刮卡
使用了一些参数，请使用Web容器之后再预览如tomcat,nginx<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"><title>刮刮原创 2016-08-04 14:18:12 · 974 阅读 · 0 评论 -
零基础学习网页制作（一）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；一、新建一个html 1）新建一个txt文档 windows操作系统可以在桌面右键新建一个文本文档，暂且命名为lesson_1原创 2016-09-29 15:30:44 · 3175 阅读 · 3 评论 -
零基础学习网页制作（二）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；二、一些简单的html呈现元素组件 1)描述 很多人都会编辑word,如果我们把编辑word当做文本编辑html,那么word原创 2016-09-29 15:32:22 · 1298 阅读 · 4 评论 -
零基础学习网页制作（三）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；三、改变一些显示元素的样式 1)描述 第二章大致介绍了一些类似word中拖控件,输入文字的功能,这一章主要介绍如何修改这些控件原创 2016-09-29 15:34:39 · 1377 阅读 · 2 评论 -
零基础学习网页制作（四）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；四、整合已学的元素 1)描述 前面讲了一些简单的呈现元素和它们基本样式的修改,这一章主要将它们整合在一起,大致代码如下:<ht原创 2016-09-29 15:35:33 · 1327 阅读 · 2 评论 -
零基础学习网页制作（五）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；五、如何定位一个元素的位置(一) 1)描述 这边可以认为是一条公路上有茫茫多的汽车,每个汽车在公路中之间的距离控制以及每辆车中原创 2016-09-29 15:36:55 · 1165 阅读 · 5 评论 -
零基础学习网页制作（六）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；六、如何定位一个元素的位置(二) 1)描述 元素的绝对定位和相对定位 2)代码解释 引入了position这个属性,常用f原创 2016-09-29 15:37:40 · 1216 阅读 · 3 评论 -
零基础学习网页制作（七）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；七、如何定位一个元素的位置(三) 1)描述 postion定位与padding内边框定位的混合使用2)代码解释<html>原创 2016-09-29 15:38:23 · 1314 阅读 · 1 评论 -
零基础学习网页制作（八）
郑重声明： 1.所谓的零基础并不是真的零基础，首先你会用电脑的一些简单操作，如：新建一个文本文档(txt)； 2.文章仅供本人娱乐，如有雷同，纯属巧合； 3.文章的目的还有一个，告诉一些不懂写代码的人，写代码没那么神奇，告诉那些了解一点点代码的人，写代码没那么容易；八、如何把样式抽离出元素 1)描述 直接将style写在元素中,就会导致页面显示的元素很混乱,我们可以把这些样式抽离出来书写.原创 2016-09-29 15:39:02 · 1317 阅读 · 4 评论 -
比较精简的css时间轴
css时间轴代码原创 2015-05-20 13:16:09 · 4414 阅读 · 0 评论 -
div和table的区别之我见
1、页面渲染性能的区别：DIV是即读即加载的渲染方式。table 完全读完后才会开始渲染。DIV在遇到与自己对称的之前，照样加载 div 中的内容。而table在读到与它对称的 之前，table中的内容不加载。但如果网络速度够快，基本上感觉不到差异。除非是个4、5屏的大首页，肉眼能看出一点区别。2、结构与表现分离：使用DIV相对更语义化，利于搜索引擎优化。搜索引擎喜欢内容与修饰分开。另外，就像是一个原创 2015-05-13 10:13:01 · 1486 阅读 · 0 评论 -
JS正则校验数字，特殊字符，邮箱基本格式
一）校验数字原创 2014-05-08 17:06:47 · 2276 阅读 · 0 评论 -
JS获取操作系统及浏览器信息
Insert title herevar sUserAgent;function getOS() { sUserAgent = navigator.userAgent; return sUserAgent;}document.writeln(getOS());原创 2014-04-25 11:10:45 · 1094 阅读 · 0 评论 -
css控制textarea固定大小不可拖动
有时候textarea和其他表单元素排列的太紧凑的话，用户拉动textarea就会影响整个页面的美观；1，隐藏右下角可拖动状态条 resize:none;2,控制高度宽度（可以通过 cols 和 rows 属性来规定 textarea 的尺寸，不过更好的办法是使用 CSS 的 height 和 width 属性。） width: 300px; height:原创 2014-10-21 17:36:19 · 13033 阅读 · 0 评论 -
关于input标签只能输入数字
创建一个input标签添加如下： onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" type="text" />原创 2014-10-17 10:08:43 · 553 阅读 · 0 评论 -
table表单边框
table,th,td{ border:1px solid blue;}/*边框像素1px；solid代表实心;颜色:blue;*/原创 2014-10-17 10:00:13 · 836 阅读 · 0 评论 -
固定位置不浮动属性
position:fixed;/*fixed总是以body为定位时的对象，总是根据浏览器的窗口来进行元素的定位，通过"left"、 "top"、 "right"、 "bottom" 属性进行定位。*/原创 2014-10-17 10:05:08 · 1198 阅读 · 0 评论 -
readOnly和disabled的区别
Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别，总结如下： Readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，但是表单元素在使用了disabled后，当我们将表单以 POST或GET的方式提交的话，这个元素的值不会被传递出去，而re转载 2014-10-17 10:08:11 · 556 阅读 · 0 评论 -
CSS控制字体粗度
.style{ font-weight:bold;}.style_another{ font-weight:800;}原创 2014-10-20 17:17:53 · 1273 阅读 · 0 评论 -
js绑定回车事件
全局触发式绑定document.onkeydown = function(e){ if(!e) { e = window.event; } if((e.keyCode || e.which) == 13) { //event }}原创 2014-10-20 17:22:13 · 774 阅读 · 0 评论 -
li标签下a标签的宽高度显示
默认情况下，即使你为a标签添加了css如下：a{ width:100px; height:100px; background:red;}这个时候不一定会显示真实效果;貌似默认这个背景是隐藏的所以修改css如下:a{ width:100px; height:100px; background:re原创 2014-10-20 17:20:45 · 1857 阅读 · 0 评论 -
CSS中padding和margin的区别
在CSS中margin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离。 下面讲解 padding和margin常用的用法一、padding1、语法结构（1）padding-left:10px; 左内边距（2）padding-right:10px; 右内边距（3）pad转载 2014-10-20 17:19:44 · 562 阅读 · 0 评论 -
HTTP 方法：GET 对比 POST
两种最常用的 HTTP 方法是：GET 和 POST。什么是 HTTP？超文本传输协议（HTTP）的设计目的是保证客户机与服务器之间的通信。HTTP 的工作方式是客户机与服务器之间的请求-应答协议。web 浏览器可能是客户端，而计算机上的网络应用程序也可能作为服务器端。举例：客户端（浏览器）向服务器提交 HTTP 请求；服务器向客户端返回响应。响应包含关于请求的状态信息转载 2014-12-01 11:10:22 · 626 阅读 · 0 评论 -
http各种返回状态
注：数据来源于w3c，备用1xx: 信息消息:描述:100 Continue服务器仅接收到部分请求，但是一旦服务器并没有拒绝该请求，客户端应该继续发送其余的请求。101 Switching Protocols服务器转换协议：服务器将遵从客户的请求转换到另外一种协议。2xx: 成功消息:描述:原创 2014-12-01 11:03:22 · 831 阅读 · 0 评论 -
CSS3之渐变色按钮
CSS3之渐变色按钮 .my_btn { background: linear-gradient(bottom,blue,#fff); background: -ms-linear-gradient(bottom,blue,#fff); background: -webkit-linear-gradient(bottom,blue,#fff); bac原创 2015-04-20 14:14:21 · 5876 阅读 · 0 评论 -
echart.js绘制可缩放折线图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>echart.js绘制可缩放折线图</title> <script src="../js/esl.js"></script> <script> var json = [["2000-06-05", 116], ["原创 2017-03-09 10:38:48 · 4936 阅读 · 1 评论