某些相邻的margin会发生合并，我们称之为margin折叠；

margin折叠常规认知：
·margin折叠只发生在块级元素上；
·浮动元素的margin不与任何margin发生折叠；
·设置了属性overflow且值不为visible的块级元素，将不与它的子元素发生margin折叠；
·绝对定位元素的margin不与任何margin发生折叠；
·根元素的margin不与其他任何margin发生折叠

js与原生进行数据交互，简单来说就是原生拦截js传到的数据
var u = navigator.userAgent;

    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g

    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

//事件触发后获取productID值，进行下边判断；

if (isiOS === true) {

   window.webkit.messageHandlers.jsCallGoodsDetail.postMessage({"productId": productID});

} else {

   window.andView.getGoodsDetail(JSON.stringify({"productId": productID}));

}
iframe中子页面找寻父页面中的某个元素
 $(window.parent.document).contents().find("#mainFrame").attr("src",_url);
让P标签中的文字保持两行，多余的内容显示为省略号...
 {

     overflow : hidden;

     text-overflow: ellipsis;

     display: -webkit-box;

     -webkit-line-clamp:;

     -webkit-box-orient: vertical;

 }

jq判断元素显示或者隐藏

 if(!node.is(':visible')){　　//如果node是隐藏的则显示node元素，否则隐藏

 　　node.show();　

 }else{

 　　node.hide();

 }

 if(node.is(':visible')){　　//如果node是显示的则隐藏node元素，否则显示

 　　node.hide();

 }else{

 　　node.show();

 }

jq获取URL参数

//获取url参数

function getParam(name) {

     var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象

     var r = window.location.search.substr(1).match(reg);  //匹配目标参数

    if (r!=null) return unescape(r[2]); return null; //返回参数值

 }
//找不到时返回值为null或者undefined

 清除select在iOS和Android上的默认样式
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>下拉框</title>

    <style type="text/css">

        select {

            /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/

            border: solid 1px #000;

            /*很关键：将默认的select选择框样式清除*/

            appearance:none;

            -moz-appearance:none;

            -webkit-appearance:none;

            /*将背景改为绿色*/

            background:green;

            /*留出一点位置，避免被文字覆盖*/

            padding-right: 14px;

        }

        /*清除ie的默认选择框样式清除，隐藏下拉箭头*/

        select::-ms-expand { display: none; }

    </style>

</head>

<body>

    <select>

        <option>2342</option>

        <option>fsdfsdfd</option>

        <option>8430892304iokflsd</option>

    </select>

</body>

　去除网页在iOS设备上会自动识别电话号码的属性

<meta name = "format-detection" content = "telephone=no">

　去除input select在iOS和Android上的默认属性

//iOS端

background-color:transparent; border-color:transparent;

//Android端 仅仅使用上面的代码还不够，可以发现select框在某些浏览器（包括微信）内置浏览器下 还会有箭头以及高亮的线框，要除去这个可以使用

-webkit-appearance: none;

我们将input、select框设为透明的目的就是为了方便使用设计师制作的样式（即使差1、2个px没对齐也不会察觉）

注意：select的下拉框的样式跟具各个浏览器的不同都不会不同。这里就不研究了！

去除ios下的数字自动识别为电话号码影响样式显示及体验的问题

<meta name="format-detection" content="telephone=no">

　　

　

css/html/Javascript/getUrlCode/各种前端小点汇总集合的更多相关文章

  1. JavaScript中的各种小坑汇总

    1.Number()将部分非数字类型转换为0 强制转换为数值类型函数: parseFloat.parseInt 优点:对非数值类型统一返回NaN 缺点:会将一部分符合数值类型的字符串也识别为数值 pa ...

  2. 新手理解HTML、CSS、javascript之间的关系-修订

    几年前写过一篇博文 <新手理解HTML.CSS.javascript之间的关系>,没想到网上出现了不少转载,当时没有太用心,里面的很多内容有待商榷,这里发布重新发布一篇. 网页主要有三部分 ...

  3. 使用selenium进行爬取掘金前端小册的数据

    Selenium 简介 百度百科介绍: Selenium [1] 是一个用于Web应用程序测试的工具.Selenium测试直接运行在浏览器中,就像真正的用户在操作一样.支持的浏览器包括IE(7, 8, ...

  4. web实践小项目<一>:简单日程管理系统（涉及html/css，javascript，python，sql，日期处理）

    暑假自学了些html/css,javascript和python,苦于学完无处练手几乎过目即忘...最后在同学的建议下做了个简单日程管理系统.借第一版完成之际,希望能将实践期间犯过的错误和获得的新知进 ...

  5. 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记

    [CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...

  6. 前端网络、JavaScript优化以及开发小技巧

    一.网络优化 YSlow有23条规则,中文可以参考这里.这几十条规则最主要是在做消除或减少不必要的网络延迟,将需要传输的数据压缩至最少. 1)合并压缩CSS.JavaScript.图片,静态资源CDN ...

  7. 前端小技巧：css sprite----V客学院技术分享

    前端小技巧:css sprite 因为英文名叫sprite,翻译过来是精灵,而雪碧饮料也叫sprite,所以叫精灵兔或者雪碧图. 它有什么作用呢? 当用户在浏览器里输入一个URL地址的时候,你会感觉无 ...

  8. 【CSS复合选择器、元素显示模式、背景】前端小抄(3) - Pink老师自学笔记

    [CSS复合选择器.元素显示模式.背景]前端小抄(3) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS的复合选择器 1.1 什么是复合选择器 在 CSS 中,可以根据选 ...

  9. 不会JavaScript能混前端么？能拿到高薪么？

    不会JavaScript能混前端么?能拿到高薪么? 答案是:很难! 为什么这么说呢,理由很简单 1)有很多企业不注重前端开发,当然也就不会给你高薪了,这样的企业以小企业居多. 他们一般对前端开发的认识 ...

随机推荐

  1. 17秋 SDN课程 第一次上机作业

    第一题 拓扑: 测试连通性: 第二题 拓扑: 测试连通性: 第三题 拓扑: 测试连通性:

  2. Javascript 高级程序设计（第3版） - 第02章

    2017-05-10 更新原文: http://www.cnblogs.com/daysme 在 html 中使用 js 把js代码写在 <script type="text/java ...

  3. NPOI导入导出EXCEL通用类，可直接使用在WinForm项目中

    由于XSSFWorkbook类型的Write方法限制,Write完成后就自动关闭流数据,所以无法很好的支持的Web模式,网上目前也未找到好的解决方案. 注意:若直接使用在WinForm项目中,必需先下 ...

  4. hdu 1392 Surround the Trees 凸包裸题

    Surround the Trees Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Other ...

  5. JaveWeb 公司项目（2）----- 类模态窗口显示DIV并将DIV放置在屏幕正中间

    上一篇博客写的是通过隐藏显示进行div的替换,接下来需要在原有的div前添加一个div,进行表单的提交,需要将div放置在正中间,然后类似C#中的模态窗口,在进行完新弹出的div操作之后,才可以进行下 ...

  6. P1182 数列分段`Section II`

    传送门 思路: 求数列每段和的最大值的最小值,很明显是用二分法求解,加贪心检验.本题关键是要怎么去高效的check,可以考虑一个贪心的思路,能加的就加上,不能则新开一段,so对于二分的值 u ,我们从 ...

  7. jmeter3.2 版本完美实现Load Test报表

    今天下载了最新版的apache tomcat jmeter 3.2,需要jdk1.8以上的版本. 用非GUI模式运行压力测试后,出现的报表太完美了. 将jmx脚本放在就jmeter_home/bin下 ...

  8. MATLAB数据类型

    数据类型 1数值类型 @整数 *浮点型转整数型的转换函数,将数值转换为最为接近的整数值,若分数部分为0.5时,转换为最接近的两个整数中绝对值较大的一个. *取整函数: floor(x)向下取整 cei ...

  9. Redis与RabbitMQ作为消息队列的比较

    简要介绍 RabbitMQ RabbitMQ是实现AMQP(高级消息队列协议)的消息中间件的一种,最初起源于金融系统,用于在分布式系统中存储转发消息,在易用性.扩展性.高可用性等方面表现不俗.消息中间 ...

  10. Go语言学习之1 基本概念、环境搭建、第一个Go程序

    一.环境搭建 见我的这篇博客 https://www.cnblogs.com/xuejiale/p/10258244.html 二.golang语言特性1. 垃圾回收    1) 内存自动回收,再也不 ...