随笔分类 - css
摘要：常见列表布局，效果如下图。常见图与图之间经常会留间距，下图图与图没留间距 1、第一种列表布局：float + margin 1.2、第一种列表布局相应代码 2、第二种列表布局：float + border(border充当间距) 解析：第二种方式开始列没有给间距 2.2、第二种列表布局相应代码 3、
阅读全文
摘要：1、table样式首先设置表格边框，属性设置表格的边框是否被合并为一个单一的边框。 table{ border-collapse: collapse; border-spacing: 0;} 2、固定表头 2.1、原理：表头和表身分开,表身设置可滚动table-body{overflow-y:scr
阅读全文
摘要：min-width: 浏览器缩小设置min-width，元素最小也是min-width设置的值。设置min-width元素不会压扁。 max-width：元素最大宽度
阅读全文
摘要：css自适应浏览器大小 1、屏幕 > 900px :显示3列 2、450px < 屏幕 < 900px :显示2列 3、屏幕 < 450px :显示1列
阅读全文
摘要：keyframes应用在animation上，animation应用在元素上。
阅读全文
摘要：.arrow_box{animation: glow 800ms ease-out infinite alternate; } @keyframes glow { 0% { border-color: #393; box-shadow: 0 0 5px rgba(0,255,0,.2), inset 0 0 5px rgba(0,255,0,...
阅读全文
摘要：js评价五星 1、图片（star.png）： 2、图片和html文件在同级目录
阅读全文
摘要：在线css兼容性处理地址：autoprefixer.github.io
阅读全文
摘要：//table1=head和table2=body水平滚动条级联滚动 $(document).ready(function () {
阅读全文
摘要：第一种： <div> <div class="right"> <p></p> <p></p> <p></p> </div> <div class="right"> <p></p> <p></p> <p></p> </div> </div> 第二种： <div> <p></p> <p></p
阅读全文
摘要：C语言 Java语言 Javascript语言
阅读全文
摘要：/*蒙版*/ .loading-mask { width: 100%; height: 100%; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; opacity: 0.3; filter: alph...
阅读全文
摘要：white-space: nowrap 不换形 overflow: hidden 隐藏长度超出部分 text-overflow:ellipsis 文字长度超出用省略号代替 <p style="width:300px;line-height:20px;"> <span style="display:i
阅读全文
摘要：@keyframes rotating{from{transform:rotate(0)}to{transform:rotate(360deg)}}animation:rotating 1.2s linear infinite
阅读全文
摘要：transform让背景图标旋转360度 a b {display: inline-block;width: 14px;height: 14px;background: url(/img/button_img.png) -1px -1px no-repeat; a:hover b {-moz-tra
阅读全文
摘要：<html><head><title>上传按钮样式优化</title> <style>.form-element-file-wapper { position: relative; width: 100px; height: 32px; overflow: hidden; margin: 0 aut
阅读全文