频道栏目
首页 > 资讯 > HTML/CSS > 正文

pamo前端实习

16-12-09        来源:[db:作者]  
收藏   我要投稿

layer口号是:由职业前端倾情打造,面向所有层次的前后端程序猿,中国最容易使用的前端UI解决方案。

可以看出layer是一个用户界面设计框架,弹出层是他的一大特点,我们公司现在的项目对于弹框,弹出层的设计都是使用layer。使用方法也是非常的简单好理解。

layer.open({
  type: 2,
  title: '聊天室',
  area: ['500px', '600px'],
  fix: false,
  shadeClose: true,
  border: [0],
  shade : [0.9, '#000'],
  content: 'index.html'
});

这段代码是一个类似qq聊天窗口:

这里写图片描述

这边拿出两个参数介绍一下:

1、type: type - 基本层类型

类型:Number,默认:0

layer提供了5种层类型。可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)。 若你采用layer.open({type: 1})方式调用,则type为必填项(信息框除外)

2、 area: area - 宽高

类型:String/Array,默认:'auto'

在默认状态下,layer是宽高都自适应的,但当你只想定义宽度时,你可以area: '500px',高度仍然是自适应的。当你宽高都要定义时,你可以area: ['500px', '300px']

3、content: content - 内容

类型:String/DOM/Array,默认:''

content可传入的值是灵活多变的,不仅可以传入普通的html内容,还可以指定DOM,更可以随着type的不同而不同。

在布局的时候最好使用百分比的形式,不固定宽高,外框设计时:

html,body{
    width:100%;
    height:100%;
}
#container{
    width:100%;
    height:100% 
}

jQuery中拿到某个元素的高度:

$('').height();

input中改变placeholder(占位符)文字颜色的方法:

/*修改placeholder的颜色*/
        input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
               color: #28A1DE;  
        }

        input::-moz-placeholder { /* Mozilla Firefox 19+ */
               color: #28A1DE;
        }

        input:-ms-input-placeholder,
            textarea:-ms-input-placeholder {
                color: #28A1DE;
        }

        input::-webkit-input-placeholder,
            textarea::-webkit-input-placeholder {
                color: #28A1DE;
        }
相关TAG标签
上一篇:[Web前端技术教学]网页布局-基础布局练习-带框的界面铺满整个浏览器
下一篇:Reactjs性能优化(下)
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站