- 博客(45)
- 收藏
- 关注
原创 用图片替换文本
用图片替换文本(使用背景图片替换掉文本内容)第一种方法(我认为最好的一种方法) .content { text-indent: 100%;/*缩进父元素宽度的100%*/ white-space: nowrap;/*不换行*/ overflow: hidden;/*隐藏多出去的文字*/ background: url
2017-08-30 14:02:51
755
原创 CSS隐藏文字并用图片代替
在做项目时想把文字隐藏并用图片代替,隐藏文字内容,但是需要保留它的物理空间来占位,可以背景图片的插入.content { text-indent: 100%;//缩进父元素宽度的100% white-space:nowrap;//不换行 overflow: hidden;//隐藏多出去的文字 background: url(ima
2017-08-29 15:04:09
517
原创 jquery:点击之后变颜色,点击另一个,另一各变颜色,当前的恢复颜色
jquery:点击之后变颜色,点击另一个,另一各变颜色,当前的恢复颜色
2017-08-09 14:23:36
25954
5
原创 jquery:实现全选和取消全选
jquery:用jquery实现全选和取消全选1、目前我遇到的最简单的一种方法,如果有更好的方法,大家可以分享一下全选 image1.jpg image2.jpg image3.jpg image4.jpg $(function() { $('#all').on('click',function(){ if(
2017-08-08 17:15:31
14561
原创 jquery:为动态加载的元素添加点击事件
jquery:为动态加载的元素添加点击事件最近在做项目的时候遇到了这样一个问题,给用ajax动态加载出来的内容添加点击事件,但是怎么都触发不了,经过查询试验总结出正确的写法在jquery1.7之前的版本中用的是live()方法,但是live()方法在1.7中已经不建议使用,1.9中删除了这个方法live()方法适用于匹配选择器的当前及未来的元素(例如有脚本创建的新元素)重点是自jq
2017-07-25 17:35:13
17201
原创 node.js:回调函数
node.js:回调函数1、什么是回调?node.js异步编程的直接体现就是回调,回调函数在完成任务后就会被回调。所以我们先来了解一下以下的内容。然后再来看回调函数。function exam(thing) { console.log(thing); } function names(callback, thing) { thing +=' is a good nam
2017-05-20 20:57:27
514
原创 javascript:创建数组并赋值的三种方法
javascript:创建数组并赋值的三种方法第一种方法:var array = new Array();array[0] = 100;array[1] = 99;array[2] = 98;第二种方法:创建数组的同时赋值var array = new Array(100, 99, 98);第三种方法:var array = new Array[
2017-04-14 11:40:44
19569
原创 CSS:z-index
CSS:z-index1、用法 z-index:决定了一个HTML元素的层叠顺序。拥有高的层叠顺序的元素总是会处于拥有层叠顺序较低的元素的前面。换句话说,z-index越高,这个元素再层叠顺序中越靠上。注:z-index属性只能在定位元素中有效(position:absolute | relative |fixed) 2、浏览器兼容性所有的主流浏览器都支持z-index属性。
2017-04-11 09:07:38
321
转载 CSS3:background-size
CSS3:background-size1、定义:background-size属性规定背景图像的尺寸。2、用法:background-size:length | percentage | cover | contain属性值:length:设置背景图像的高度高度和宽度。第一个值设置宽度,第二个值设置高度。如果只设置一个值,则第二个值会被设置为autopercentage:以父
2017-03-27 19:37:43
475
原创 CSS:改变select、option标签的默认样式
CSS:select标签、option标签select标签和option标签是自带有CSS样式的1、用纯CSS方式去除默认的select标签方法一:
2017-03-27 18:06:57
54505
转载 CSS3:appearence
CSS3:appearence属性1、所有浏览器都不支持appearance属性2、Firefox支持替代的-moz-appearance属性3、Safari和Chrome支持替代的-weblit-appearance属性语法:appearance:normal| icon| window| button | menu | field;值描述
2017-03-27 07:46:43
520
原创 CSS:字体倾斜
CSS:字体倾斜(个人理解)在CSS样式中,总会出现斜体字,斜体字一共分为两部分:1、倾斜角度是固定的在浏览器中,默认用斜体表示。 语法文本css样式:font-style:italic; font-style:oblique;2、倾斜角度不固定用CSS3中的transform中的skew属性值实现文字的倾斜效果skew(30deg,30deg)表示水平方向
2017-03-21 14:16:08
17172
原创 CSS:首字母字号变大而不影响下划线
CSS:首字母字号变大而不影响下划线要求:字母全部大写并带有下划线,首字母稍大,有24px,其余字母稍小解决办法:1、
2017-03-21 11:15:26
1913
原创 CSS:font-variant
CSS:font-variantfont-variant:属性设置小型大写字母的字体,但是所有使用小型大写字体的字母与其余文本相比,字体尺寸小。所有主流浏览器都支持font-variant属性,除了IE不支持属性值inherit。值 normal默认值。浏览器会显示一个标准的字体。small-caps会显示小型大写字母的字体。
2017-03-21 10:37:23
535
原创 CSS:text-transform
CSS:text-transformtext-transform:控制属性的大小写。所有浏览器都支持text-transform.IE浏览器不支持inherit属性值。值 none默认。定义带有小写字母和大写字母的标准的文本capitalize文本中的每个单词以大写字母开头。uppercase定义仅有大写字母l
2017-03-21 10:05:29
523
原创 CSS3:opacity
CSS3:opacity属性值 opacity指定不透明度,从0.0(完全透明)到1.0(完全不透明)inherit从父元素继承.wrap{ background-color:#C30; opacity:0.4; filter:alpha(opacity=40); -moz-opacity:0.4; -kht
2017-03-20 21:52:25
299
转载 position
CSS:positionposition拥有三种定位机制:静态定位、相对定位、绝对定位相对定位:相对于自身原有位置进行偏移,仍处于标准文档流中,随机拥有偏移属性和z-index属性position属性可设置4个属性值:static(静态定位)relative(相对定位)absolute(绝对定位)fixed(固定定位)absolute和fixed都属于绝对定位
2017-03-14 19:23:59
412
转载 水平垂直居中
CSS:水平垂直居中已知高度宽度的水平垂直居中1、绝对定位+负边距:将top、left设置为50%,再用margin将盒子拉回它本身的一半。*{ margin:0; padding:0; list-style:none;}.content{ position:absolute; top:50%; left:50%; margin:-100px 0 0 -
2017-03-13 22:01:22
293
原创 垂直居中
CSS:垂直居中1、子元素为单行内联元素:设置父元素的height等于line-height*{ margin:0; padding:0; list-style:none;}#wrap{ height:27px; line-height:27px; background-color:#36F;}垂直居中优点:适用于所有浏览器缺点:只对文本有效,块级元素是无效的
2017-03-13 19:45:13
323
原创 水平居中
水平居中(总结目前已知道的,后续会继续添加)子元素为:行内元素定宽块状元素不定宽块状元素1、对于子元素是行内元素,对它的父元素设置text-align:center;*{ margin:0; padding:0; list-style:none;}#wrap { text-align:center;} 水平居中2、对于定宽块状元素,设置marg
2017-03-13 17:41:04
271
转载 三栏式布局
三栏式布局:左右两栏宽度固定(如果想宽度不固定,将宽度值改为百分值),中间栏宽度自适应三栏式布局大体上分为四种:自身浮动法、绝对定位法、margin负值法、flex布局法三栏式布局详细分为五种方法:float+marginposition+marginfloat+负margin(圣杯布局)float+负margin(双飞翼布局)flex布局(这里暂时不做介绍)1、float
2017-03-11 20:19:20
2971
原创 CSS:清除浮动
CSS清除浮动的方法1、在浮动元素末尾处添加一个空的标签如并在CSS中赋予.clear{clear:both}也可以使用或.wrap{ border:1px solid #000; background-color:gray;}.left{ float:left; height:80px; width:100px; background-color:#0F0;}
2017-03-11 10:23:32
271
转载 CSS浮动框是否脱离文档流?
CSS浮动框是否脱离文档流?http://www.th7.cn/web/html-css/201401/17089.shtml
2016-12-09 11:45:57
2508
原创 CSS:盒子3D模型
CSS:盒子3D模型从上到下分为5层1、border2、content+padding3、background-image4、background-color5、margin
2016-12-08 22:03:53
1641
转载 HTML:HTML中的元素
HTML中的元素无论你想了解哪个 HTML 元素,第一个要问的问题就是:它是块级元素还是行内元素,因为它们在盒模型上的表现有很大的不同,不过在了解它们的不同之前我们还得先知道另外一个概念————替换元素和非替换元素,其中替换元素就是指浏览器是根据元素的属性来判断具体要显示的内容的元素,比如 img 标签,浏览器是根据其 src 的属性值来读取这个元素所包含的内容的,常见的替换元素还有 inpu
2016-12-08 13:28:01
440
原创 HTML:常见的元素
HTMLHTML中常见的块级元素div、p、ol、ul、dl、form、table、blockquote、h1-h6、header、aside、canvas、pre、nav、figcaption、figure、article、sessionHTML中常见的行内元素img、input、span、a、label、select、textarea、br、i、em、strong、smal
2016-12-07 21:33:32
344
转载 jquery:attr()
jquery:attr()定义和用法attr() 方法设置或返回被选元素的属性和值。当该方法用于返回属性值,则返回第一个匹配元素的值。当该方法用于设置属性值,则为匹配元素设置一个或多个属性/值对。语法返回属性的值:$(selector).attr(attribute)设置属性和值:$(selector).att
2016-12-06 20:12:39
328
转载 jquery:prop()
用jquery改变除了css以外的属性:jQuery prop() 方法定义和用法prop() 方法设置或返回被选元素的属性和值。当该方法用于返回属性值时,则返回第一个匹配元素的值。当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。注意:prop() 方法应该用于检索属性值,例如 DOM 属性(如 tagName、nodeName、de
2016-12-06 19:56:40
230
原创 jquery:css()
jquery:css()css()可以設置或者返回被選HTML元素的一個或多個樣式的屬性1、返回css屬性的值css("屬性的名")$(document).ready(function(){$("button").click(function(){ alert( $("p").css("background-color"));
2016-12-06 18:06:52
237
原创 animate.css
animate.cssanimate.css是一个css3动画库今天上网搜了一下,对animate.css有一个简单的了解1、怎么使用animate.css首先下载animate.css https://daneden.github.io/animate.css/其次: 接下来 $("butto
2016-12-06 17:40:26
357
原创 FreeCodeCamp:Seek and Destroy
Seek and Destroy实现一个摧毁(destroyer)函数,第一个参数是待摧毁的数组,其余的参数是待摧毁的值。用到的知识:arguments、Array.filter()、indexOf()function destroyer(arr) { var arr1 = []; for(var i = 1; i arr1.push(arguments
2016-11-24 21:02:02
278
转载 jsp状态管理
jsp状态管理http协议是无状态性的保存用户状态的两大机制1、session2、CookieCookie:是Web服务器保存在客户端的一系列文本信息主要应用:判定注册用户是否已经登录网站、“购物车”的处理Cookie的作用:对特定对象的追踪 保存用户网页浏览记录的习惯
2016-11-24 19:00:32
245
转载 JSP:include指令与include动作的区别
include指令与include动作的区别: include指令include动作语法格式发生作用的时间页面转换期间请求期间包含的内容文件的实际内容页面的输出转换成Servelt主页面和包含页面转换为一个Servlet主页面和包含页面转换为独立的Servlet编译时间较慢—
2016-11-23 21:23:11
324
转载 Java:jsp内置对象
JSP内置对象JSP内置对象:Web容器创建的一组对象,不使用new关键字创建就可以使用JSP有九个内置对象:out对象、request对象、response对象、session对象、application对象(前五个是常用的)、Page对象、pageContext对象、exception对象、config对象1、out对象out对象是JspWriter类的实例,是向客户端(浏览器
2016-11-22 20:59:18
281
转载 javascript:indexOf()
indexOf()方法返回指定值在字符串对象中首次出现的位置。从fromIndex位置开始查找,如果不存在,则返回-1.语法:参数:searchValue:一个字符串表示被查找的值 fromIndex(可选):表示调用该方法的字符串开始查找的位置。可以是任意整数。默认值为 0。如果 fromIndex 则查找 整个字符串(如同传进了0
2016-11-20 17:22:49
390
原创 FreeCodeCamp:Mutations
蛤蟆可以吃队友,也可以吃对手。如果数组第一个字符串元素包含了第二个字符串元素的所有字符,函数返回true。解法:function mutation(arr) {var arr1=arr[0].toLowerCase();var arr2=arr[1].toLowerCase();for(var i=0;iif(arr1.indexOf(arr2[i])r
2016-11-20 17:05:22
617
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人