前端
积累jiuduo
这个作者很懒,什么都没留下…
展开
-
绝对定位和相对定位
CSS的相对定位和绝对定位通常情况下,我们元素的position属性的值默认为static 就是没有定位,元素出现在正常的文档流中,,这个时候你给这个元素设置的left,right,bottom,top这些偏移属性都是没有效果的,不会生效,比如你设置一个距离左边距偏移100px的声明:left:100px 那么这条声明不会起到任何效果。还有z-index属性在这时也不会生效。也就是说我们平转载 2016-11-24 10:43:26 · 309 阅读 · 0 评论 -
关于行内元素的宽高
电话面试,被问到行内元素和块级元素的区别。我回答说,块级元素独占一行,可设置宽高。行内元素不会独占一行,且不能设置宽高。然后面试官问我,img和input是行内元素么,他们能设置宽高吗?我一想,是啊,这两个也是行内元素,不过却能设置宽高啊。于是当场被问住了,说不出所以然。。。然后自己查阅资料,发现了这篇博文,为何img、input等内联元素可以设置宽、高豁然开朗,原来img和input是替换元素,...转载 2018-03-06 19:26:16 · 425 阅读 · 0 评论 -
原生弹窗参考
.dialogBackgrounddiv {width:100%;height:100%;position:fixed;top:0px;left:0px;z-index:50;background:rgba(5,4, 4,0.5);color:rgba(0,0, 0,0.5);}.dialog{positi转载 2017-11-07 18:35:51 · 467 阅读 · 0 评论 -
es6 箭头函数
ES6标准新增了一种新的函数:Arrow Function(箭头函数)。箭头函数与传统的JavaScript函数主要区别在于以下几点:1、对 this 的关联。函数内置 this 的值,取决于箭头函数在哪儿定义,而非箭头函数执行的上下文环境。2 、new 不可用。箭头函数不能使用 new 关键字来实例化对象,不然会报错。3、this 不可变。函数内置 this 不可变,在函数体转载 2017-09-01 11:17:45 · 245 阅读 · 0 评论 -
Vue组件绑定自定义事件(子向父传递事件)
Vue组件使用v-on绑定自定义事件: 可以分为3步理解: 1.在组件模板中按照正常事件机制绑定事件: template: '{{ counter }}', 如上,v-on:click就是用来给子组件绑定点击事件的,这就是原生的自带的事件,容易理解。 2.子组件的事件发生时,在事件函数中向父组件“报告”这一事件(使用$emit):转载 2017-09-01 10:26:58 · 2772 阅读 · 0 评论 -
vue 全局组件和局部组件
这两天学习了Vue.js 感觉组件这个地方知识点挺多的,而且很重要,所以,今天添加一点小笔记。 首先Vue组件的使用有3个步骤,创建组件构造器,注册组件,使用组件3个方面。 代码演示如下:html> body> div id="app"> my-component>my-component>转载 2017-08-30 20:37:32 · 586 阅读 · 0 评论 -
Vue.js- 修饰符
原文地址 http://www.cnblogs.com/niklai/p/7171873.html一、v-model的修饰符 v-model 是用于在表单表单元素上创建双向数据绑定的指令。在 input> 和 textarea> 上,默认通过监听元素的 input 事件来更新绑定的属性值。为了能明显的看到绑定属性值的变化,需要在Chrome浏览器中安装Vue Devtools扩展转载 2017-08-30 20:21:27 · 371 阅读 · 0 评论 -
隐藏元素后占的空间没有改变
display:none和visibility:hidden都是把网页上某个元素隐藏起来的功能,但两者有所区别,经过亲自实验,我发现使用 visibility:hidden属性会使对象不可见,但该对象在网页所占的空间没有改变(看不见但摸得到),等于留出了一块空白区域,而 display:none属性会使这个对象彻底消失(看不见也摸不到)。 ”这样的解释。 但是我觉得并不够,所以就想了一下关于他的一转载 2017-09-07 17:29:55 · 891 阅读 · 0 评论 -
html手机页面开发模板
html lang="en">head> meta charset="UTF-8"> meta http-equiv = "X-UA-Compatible" content = "IE=edge, chrome=1" /> meta name="viewport" content="width=device-width, minimum-sca转载 2017-08-21 15:56:32 · 5359 阅读 · 0 评论 -
IE8和360兼容模式下页面排版出问题的解决办法
在搞一个门户网站的项目,最近忽然发现首页在360兼容模式下和IE8下显示都有很大的问题,而之前没有这个问题。百度了一下,有人说在head中加入:可以解决,但这并不能完全解决我的问题。经过研究,我发现用取代上头的代码,会有很好的效果,具体原因未知。而在360兼容模式下出问题,需要加入就可以了。(此方法是在360官方的论坛里发现的。原理是当360浏览器在兼容模式下检测到有这么一条代码的转载 2017-08-22 13:18:33 · 1061 阅读 · 0 评论 -
css flex布局学习地址
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html转载 2017-08-24 17:07:47 · 212 阅读 · 0 评论 -
谷歌浏览器默认背景颜色解决方法以及display:inline-block;的作用
在样式里加入下面代码搞定-webkit-box-shadow: 0 0 0px 1000px white inset; -webkit-text-fill-color: #333;转载 2017-08-18 21:18:17 · 693 阅读 · 0 评论 -
页面在360浏览器下的兼容性问题解决
引言: 在Web应用的开发过程中,发现若干页面在360的浏览器上显示不正常,而在其他的浏览器上,皆为正常状态,问题出在哪里呢?问题的提出: Web页面在360的浏览器上,显示不正确。 但是在Firefox、chrome和IE8+以上的浏览器上,都是显示正常的。问题的分析 1. 检查了一些JavaScript框架,标准的jQuery类库1.x系列,确认其工作正常转载 2017-08-21 11:52:04 · 557 阅读 · 0 评论