随笔分类 - HTML5+CSS3
1
摘要：总结： 1、刚开始我是使用ur-li这种来做，但是点击其中一个，其它的都展开了，然后又替换成div-div但是这种也有相同情况，于是我只好分开来做用div div同级来做，这样就没问题了，我在想这个问题可能跟子绝对定位有关系！！！
阅读全文
摘要：总结： 1、jquery使用offset()比position()更精确
阅读全文
摘要：border: 8px solid rgba(255,255,255,0.2);
阅读全文
摘要：公司最近在做一个视频直播的功能，里面有个页面样式是需要点击收起侧边栏的，整体效果如图： 那么如何制作呢，参考了网上的代码，我发现很简单，下面就是我制作的代码： 总结： 1、是通过css动画效果来制作的，再通过js切换css里面的class来动态监听点击时的效果 2、重点是class中的cbp-spm
阅读全文
摘要：<!-- 直播播放器区域 --> <div class="live-channel-player-area"> <video id="my-video" class="video-js" controls width="320"> <source src="http://v1.live.126.ne
阅读全文
摘要：background-image: url(/resources/img/liveSupport/tx_1.svg); background-size: 16px 16px; width: 16px; height: 16px;
阅读全文
摘要：display:flex; align-items://水平对齐方式 justify-content://垂直对齐方式 flex://盒子所占大小(如果你盒子里面只有两个div，那么你设置其中之一个flex，那么另外一个会自动填充)
阅读全文
摘要：我是通过flex的水平垂直居中噢！ html,body{ width: 100%; height: 200px; } .parent { display:flex; align-items: center;/*垂直居中*/ justify-content: center;/*水平居中*/ width:100%; height:100%; backgro...
阅读全文
摘要：一开始都是行内元素，但是左边按钮和右边标题就是对不齐，于是，设置左边按钮float:left就可以了。
阅读全文
摘要：今天在使用masonry.pkgd.min.js瀑布流的时候遇到一个很奇怪的问题，官网显示正常，而我的就是显示不正确，然后我又查看一遍，原来要加这段代码就ok了，记录一下，怕以后还会遇到这个问题
阅读全文
摘要：参考地址：http://www.css88.com/archives/5206
阅读全文
摘要：问说网 > 文章教程 > 网页制作 > HTML5 Audio标签方法和函数API介绍 Audio APIHTML5HTML5 Audio预加载 HTML5 Audio标签方法和函数API介绍 问说网 • 2014-06-19 09:53:52 • 3561 浏览 Audio APIHTML5HTM
阅读全文
摘要：参考文章：1、利用公共api提取任意网站favicon.ico图标如何读取favicon根据设置favicon的方式，就有2种读取favicon的方法：A、默认直接读取网站根目录的favicon.ico文件。B、如果不存在根目录下的favicon.ico文件，就读取页面里favicon的声明。相比之...
阅读全文
摘要：参考地址document.addEventListener("fullscreenchange", function(e) { console.log("fullscreenchange", e);});document.addEventListener("mozfullscreenchange"...
阅读全文
摘要：-webkit-filter:blur(3px); -moz-filter:blur(3px); filter:url(blur.svg#blur); filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3'); filter:blu...
阅读全文
摘要：参考地址【进入和退出全屏】// Webkit (works in Safari5.1 and Chrome 15)element.webkitRequestFullScreen();document.webkitCancelFullScreen();// Firefox 10element.mozR...
阅读全文
摘要：$(".icon-a").on('click', function (e) { if ($(this).next().css('display') == "none") { $(this).children().removeClass('datagrid-ro...
阅读全文
摘要：1：background-position 加之前：background: url("../images/nav-bg.png") repeat-y scroll top left #e3e5e7; background-position: initial initial; background-...
阅读全文
摘要：CSS3圆角气泡框，评论对话框 This only needs one HTML element. For example, [text]. But it could be any element you want. The entire appearance is created only with CSS. This only needs one HTML element. For example, [text]. ...
阅读全文
摘要：border-radius: 4px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#569B0E', endColorstr='#095701', GradientType=0);如图：所以border-radius(圆角)和DXImageTransform.Microsoft.gradient(渐变色)只能兼容其中一个，解决方法：border-radius: 4px;background-color: #569B0E;filter: progid:dximagetrans
阅读全文
1
