前台一些问题样式,显示问题
2017-11-09 09:52
204 查看
在做开发时,总是找UI来调试样式的问题,自己也学到了一点
1.在一行,分配不同的大小位置用,
<div class="col-sm-8"> <div class="col-sm-3"></div> </div>2.按钮的位置 偏左 居中 偏右
style="margin:0 0 0 10px"3.css处理文字过长时显示为多余部分省略
text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden)。只有这样才能实现溢出文本显示省略号的效果。 一、仅定义text-overflow:ellipsis; 不能实现省略号效果。 二、定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果 三、同时应用: text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 可实现所想要得到的溢出文本显示省略号效果:4.限制显示长度
Js控制字符串显示长度,多出规定字符用点代替
if(str . length > 5) str = str.substring(0,5) + '...';//控制显示五个字符+....;4.刷新当前页面
window.location.reload();
5.jsp系统的时候经常会使用el标签
在EL中empty对""和null的处理都返回true,而==null对""返回false,对null返回true。比如:a ==null ,如果a是等于""字符串空。结果就是false.只能判断null empty a 不管a等于null或者"' ,结果都是true.Empty 运算符主要用来判断值是否为空(NULL,空字符串,空集合)。el表达式一般不直接用== != > < >= <=之类的表示相等不等于 大于 小于 大于等于 小于等于,而是使用字母表示的表达式,他们的表示如下:类别运算符 算术运算符 + 、 - 、 * 、 / (或 div )和 % (或 mod ) 关系运算符 == (或 eq )、 != (或 ne )、 < (或 lt )、 > (或 gt )、 <= (或 le )和 >= (或 ge ) 逻辑运算符 && (或 and )、 || (或 or )和 ! (或 not ) 验证运算符 empty 空 包括 null和"" notempty 不等于空 包括 null和""在做jsp系统的时候经常会使用el标签,而empty是使用比较多的一个,这个标签也很方便。但是一直只是会用,从来都没有好好的去思考它的执行原理,所以在写这个之前碰到了一点错误,先来看看我的错误:
Html代码 <c:if test="${not empty order.shipphone> ${order.shipphone}</c:if> 这个语句想实现的效果很简单就是进行判断如果值不为null的话才会输出,但是这样却没有实现我要的效果,页面中输出了null,这就奇怪了既然${order.shipphone}已经为null了,这个判断执行的话应该是不允许它通过的,为什么又通过了。于是乎去查询了一下数据库,得到如下:<br>于是乎就更加迷惑了,对啊值是空的啊,最后实在没办法,只好求助java群了,其中一个的话让我好好思考了一下:Java代码 是不是因为${order.shipphone}是字符串的“null” 最后再去看了一下empty的用法:Java代码 <c:if test="${! empty key}">${key}</c:if><c:if test="${empty key}">所有</c:if>当key不为空时输出key的值。当key为空时,输出“所有”规则:1若key为null时,返回true2若key为空string时,返回true3若key为空array时,返回true4若key为空map时,返回true5若key为空collection时,返回true6否则,返回false 从上面可以看出,如果是字符串null的话,这个判断当然是true,也就是说order中的shipphone本身并不为null,它有值,并且值为null,就是这个解释。 看来还是只懂表面,不懂实质啊,也没办法,工作就一个劲完成目标,有时候的确不允许停下来。 那就找一下折中的办法吧!!6.button没写type=button会导致点击时提交
原创 2016年12月06日17:08:14标签:button771[html] viewplain copy<button class="btn btn_set_wj" onclick="add_q()">弹出框</button> 改成[html] viewplain copy<button class="btn btn_set_wj" type ="button" onclick="add_q()">弹出框</button> 原因:button按钮默认为submit.7.html input标签的隐藏处理 默认值到后台
<
input
type
=
"hidden"
name
=
"id"
value
=
"隐藏的值"
>
<
input
type
=
"text"
name
=
"id"style="display:none"
value
=
"隐藏的值"
>[/code]
以上两种方法可以实现不留痕迹的隐藏。
<input type="text" style="visibility: hidden;" />
第三种方法可以实现占位隐藏(会留下空白而不显示)
8,异步刷新,点击分页按钮,返回顶部
页面: window.scrollTo(0, 0);
子页面parent: window.parent.scrollTo(0, 0);
9. lable标签 (隐式和显式的联系)
第一个标记是以显式形式将文本 "Social Security Number:" 和表单的社会安全号码的文本输入控件 ("SocSecNum") 联系起来,它的 for 属性的值和控件的 id 一样,都是 SSN。第二个标记 ("Date of Birth:") 不需要 for 属性,它的相关控件也不需要 id 属性,它们是通过在 <label> 标签中放入 <input> 标签来隐式地连接起来的
<form> [code]<label for="male">Male</label><input type="radio" name="sex" id="male" /><br />
<label for="female">Female</label><input type="radio" name="sex" id="female" /></form>[/code]
点击 文字一样可以选
<label for="username">会员名</label> <input type="text" id="username" name="username" data-rule="会员名:required" placeholder="用户名/邮箱">点击 文字 进入输入框
相关文章推荐
- ecmall2.3.0 前后台样式等无效,导致前台页面显示不正常问题解决
- 显示数据(从数据库中得到)中的html标签 用于解决数据在前台显示,样式被数据破坏的问题!!css
- 关于android视频播放显示区域不正常的问题,一些处理方法
- JFreeChart在JSP(tomcat)中的一些问题(图片不显示)
- jqgrid前台数据显示问题原因和解决方案
- Linux下Java程序中中文显示的一些问题的总结
- Ie6 Ie8样式显示问题
- 关于encodeURI两次转码和非两次转码,以及后台中文,前台不显示问题总结
- Unity有关Atlas图集的 制作,更新,替换,与有关单独精灵显示相关的一些问题
- 解决eclipse maven工程中src/main/resources目录下创建的文件夹所显示样式不是文件夹,而是"包"图标样式的问题
- js的new Date的一些问题,以及highcharts时间显示16:00
- UEditor样式被过滤无法显示问题
- magento上新产品,前台不显示不显示属性,后台却有属性问题
- 编写前台脚本时遇到的一些小问题
- PullToRefreshView的样式以及一些问题
- Axure RP Pro - 相关问题 - Style Editor样式编辑器以及已知的一些缺陷
- js的new Date的一些问题,以及highcharts时间显示16:00
- GridView的一些控制样式显示的小技巧(合并列的显示,DataFormatingString的控制)
- php一些错误的显示问题
- 上传图片并在页面显示的一些问题