整理前端css/js/jq常见问题及解决方法(1)
1、
兼容ie8圆角的解决方法:
下载ie-css3.htc文件
在css中加入behavior:url(ie-css3.htc);z-index:3; position:relative 即可
2、
去掉文本框的右下角:resize:none;
3、
html5新属性:hidden 对于不支持html5的浏览器,加上*[hidden]{display:none;}
4、
div><p>这只铅笔5元</p></div>
outerHTML:
包含整个标签,不仅限于标签内部的内容,即<div><p><这只铅笔<span>5</span>元</p></div>
innerHtml:获取元素的html和文本<p><这只铅笔<span>5</span>元</p>
innerText:这只铅笔5元
5、
要在html页面浏览器标题中添加图标
在head中加入
<link rel='icon' href="images/33.ico" type=‘image/x-ico’ />
图片需要是.ico格式
6、
css3属性:
text-overflow:ellipsis; 一行中,将超出宽度的文本设置为省略号。例如sdasasadad...
(1)移动端用于显示两行文本后省略:
overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;
(2)js实现文字显示两行后超出部分省略 eg:
var oBox=$(".type2_child3").html();
var demoHtml = oBox.slice(0,34)+'...';//加省略号
oBox=$(".type2_child3").html(demoHtml);
这几个属性一定要一起用:overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
7、
jq
sibings()方法:$("p").siblings(".aa") 查找每个p元素的所有类名为.aa的元素
8、
var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text
var checkValue=$("#select_id").val(); //获取Select选择的Value
9、
获取选中的radio的值
<input type="radio" name="sex"/>男<input type="radio" name="sex"/>女
var sex= $('input:radio[name="sex"]:checked').val();
10、
在安卓手机上去掉文本框获取焦点时的高亮边框。
.search_text:focus,:hover,:active{outline:0px; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-user-modify:read-write-plaintext-only;}
11、
渐变:background:linear-gradient(起颜色,终颜色);
要让渐变布满body全屏,在html{height:100%;}
12、
无限循环旋转图片
<img src="aa.img"/ class="aa">
<style>
.aa{animation:aa 6s linear infinite;}
@keyframes aa{
0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}
13、
设置字与字之间横向字距:letter-spacing,纵向:line-height
14、
设置多行文本的placeholder样式
textarea::-webkit-input-placeholder{}
15、
移动端
禁止页面滑动
var jinzhi=0;
document.addEventListener("touchmove",function(e){
if(jinzhi==0){
e.preventDefault();
e.stopPropagation();
}
},false);
16、
==比较:先将比较的两者转换为同一类型然后进行比较
===比较:不进行类型的转换,如果类型不同则直接返回false
17、
验证电话号码正则: var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
只允许英文和中文:
onkeyup="value=value.replace(/[\d]/g,'')"
18、
getElementsByTagName()查找标签名在ie 8及以下无效
整理前端css/js/jq常见问题及解决方法(1)的更多相关文章
- 整理前端css/js/jq常见问题及解决方法(2)
移动端 手机 1.点击图片或按钮,选中状态影响到其他范围解决:html{-webkit-user-select:none}<meta name="msapplication-tap-h ...
- 整理前端css/js/jq常见问题及解决方法(3)
jq: 1.prepend(参数);//将参数内容前置再某元素内部; eg: <div id="div1">奇妙能力歌</div> $("#div ...
- NHibernate常见问题及解决方法
NHibernate常见问题及解决方法 曾经学过NHibernate的,但是自从工作到现在快一年了却从未用到过,近来要巩固一下却发现忘记了许多,一个"in expected: <end ...
- C#用ado.net访问EXCEL的常见问题及解决方法
C#用ado.net访问EXCEL的常见问题及解决方法,除了像sql server,access常见的数据库,其实Excel文件也可以做为数据库访问. ado.net访问excel的实例: OleDb ...
- Nacos 常见问题及解决方法
Nacos 开源至今已有一年,在这一年里,得到了很多用户的支持和反馈.在与社区的交流中,我们发现有一些问题出现的频率比较高,为了能够让用户更快的解决问题,我们总结了这篇常见问题及解决方法,这篇文章后续 ...
- WebView加载本地html、js文件常见问题及解决办法
声明:基于android studio平台,php语言搭建服务器 目录: 一.JavaScript脚本语言没有反应 二.alert无法弹出 三.html页面之间不能跳转 四.屏幕缩放没有达到预期效果 ...
- Direct3D11学习:(零)常见问题及解决方法整理
转载请注明出处:http://www.cnblogs.com/Ray1024 一.概述 在D3D11学习的这个系列中,单独写一篇文章来记录自己学习过程中遇到的问题及最后的解决方法. 这篇文章的目的 ...
- 前端 css+js实现返回顶部功能
描述: 本文主要是讲,通过css+js实现网页中的[返回顶部]功能. 实现代码: HTML: <div> <button onclick="returnTop()" ...
- IIS启用GZIP压缩js、css无效的原因及解决方法
IIS启用GZIP压缩之后,原以为可以压缩所有文件了,包括html.CSS.JS.图片这些文件,但是当我检查的时候,发现并不是这样的,压缩的只有html文件,而CSS.JS并没有压缩 在卡卡网的网站速 ...
随机推荐
- Android or java https ssl exception
1.http://www.trinea.cn/android/android-java-https-ssl-exception-2/ 2.http://www.eoeandroid.com/threa ...
- 使用Google Https搜索
一. 将浏览器Google的默认搜索使用https 1. IE浏览器 进入注册表搜索"google.com"将搜索替换成https://www.google.com.hk 2. F ...
- unity, 由于project settings中time scale变成0导致动画不播放
在Mac和iOS间多次switch platform之后,忽然发现开始scene的动画不播了.进入游戏后再切回来动画恢复正常. 检查了scene的逻辑,发现没有任何问题.删除了Temp和Library ...
- MySql(一):linux 安装mysql数据库——yum安装法
mysql数据库有多种安装方式,本文只介绍在Linux服务器上最实用.最快捷的mysql server安装方法.一.Linux服务器yum安装(CentOS6.3 64位)所有在服务器上执行的命令,都 ...
- Atitit.自定义存储引擎的接口设计 api 标准化 attilax 总结 mysql
Atitit.自定义存储引擎的接口设计 api 标准化 attilax 总结 mysql 1. 图16.1:MySQL体系结构1 2. 16.7. 创建表create()虚拟函数:2 3. 16.8 ...
- TFS中如何排除Nuget的Packages文件夹
在项目的解决方案下新增.tfignore文件.文件内容如下: \packages 在项目的解决方案下新增.nuget文件夹,并新增Nuget.config文件,文件内容如下: <?xml ver ...
- js中级系列三:前端性能优化
原文链接:http://www.cnblogs.com/xxcanghai/p/5205998.html 链接:http://www.zhihu.com/question/21658448/answe ...
- C++注释规范
1 源文件头部注释 列出:版权.作者.编写日期和描述. /************************************************* Copyright:bupt Auth ...
- 配置Redmine的邮件通知功能
依据<Windows下安装Redmine 2.5.2不全然指南 >一文,我们搭建主要的 Redmine 平台.如今是时候做进一步的配置了. 作为一个项目管理平台,必须能够通知项目成员有关项 ...
- eclipse 查看源代码
文地址:http://blog.csdn.net/sushengmiyan/article/details/18798473 本文作者:sushengmiyan 我们在使用Eclipse的时候,经常是 ...