background

前端开发必须知道的CSS(一) CSS Hack

由 点点圈 提交于 2020-03-08 09:30:51
在开发中，我们常会遇到某些css在IE中显示正常，但是在Firefox中显示不是我们所希望的，或者在Firefox中正常而在IE中不是我们所要。由于不同浏览器对CSS的支持和解析不一样，或者CSS优先级不一样，所以我们常针对不同的浏览器去写不同的CSS，让它能够同时兼容不同的浏览器，这就是CSS Hack。也可以说CSS Hack就是那些能区别不同浏览器的字符，如!important, * , _ 等。在看了一些网上的相关知识后和实践后，作下总结。 各浏览器的CSS Hack ： 在IE7发布之前，区分IE与FireFox（OP等与FireFox一样），可以靠!important。譬如body{background-color:green !important;background-color:blue;} ，在IE6中打开页面，body的背景色是蓝色，因为IE6不识别!important，而Firefox识别了!important，所以在Firefox中背景色是绿色，含有!important的样式要写在前面，因为如果2个样式都能识别，后面的会覆盖前面的。 而杯具的IE7识别了!important，所以不能仅靠!important来区分Firefox了。 另外，对*号的解释，网上有些是这样说的：*: Html 元素被认为是网页上的第一个元素，即根元素。但是，IE

《CSS揭秘》-总结47个Css技巧（二）：形状技巧

由 不问归期 提交于 2020-03-08 03:45:25
注：本文案例来源于《CSS揭秘》这本书。 自适应的椭圆 用 border-radius 50% 就可以实现一个宽高自适应的椭圆。那如果想要实现半椭圆呢？ border-radius 50% / 100% 100% 0 0 上面等同于 border-radius 50% 50% 50% 50% / 100% 100% 0 0 // 横轴方向是50%的缩放，纵轴的左上，右上为100%，右下，左下为0。 平行四边形 用 transform: skewX(-10deg) 来实现~ .box position relative height 180px width 300px margin 40px auto & ::before // 在伪元素中设置倾斜，不会使得元素变形。 content: '' position: absolute top: 0 right: 0 bottom: 0 left: 0 z-index: -1 // 不会影响到内容 background: #678 transform: skew ( 10deg ) // 设置变形 菱形图片 使用 clip-path 属性。该属性可以生成多种形状。网上还找到了一个 https://bennettfeely.com/clippy/ 可以拖拽边线生成css。 clip-path: polygon ( 50% 0, 100% 50

前端复习Day12 背景渐变

由 大兔子大兔子 提交于 2020-03-07 20:58:41
CSS3 渐变 CSS3 渐变（gradient）可以让你在两个或多个指定的颜色之间显示平稳的过渡。 以前，你必须使用图像来实现这些效果，现在通过使用 CSS3 的渐变（gradients）即可实现。此外，渐变效果的元素在放大时看起来效果更好，因为渐变（gradient）是由浏览器生成的。 一、背景渐变 1）线性渐变 语法 ：background: linear-gradient(direction,color-stop1, color-stop2, ...); 说明：direction：默认为to bottom，即从上向下的渐变； stop：颜色的分布位置，默认均匀分布，例如有3个颜色，各个颜色的stop均为33.33%。 div { background : linear - gradient ( to left , red , blue ) } div { background : linear - gradient ( to right , red , blue ) } div { background : linear - gradient ( to bottom , red , blue ) } /* 浏览器默认值 */ div { background : linear - gradient ( to top , red , blue ) } 分别产生“从右到左”、

Entering background on iOS4 to play audio

由 荒凉一梦 提交于 2020-03-07 08:48:03
问题 The documentation is rather poorly written when talking about playing audio in the background. It gives the impression that all you have to do to continue playing the audio that you are currently playing is to just add a key/value pair to the info.plist file and wallah, it's magic. However, this is not the case. For instance, if I play an mp3 that is 2 minutes long, obviously the audio is long enough to be able to play after I hit the home button to send my app to the background. The thing is

js原生开发一个2048小游戏

由 假装没事ソ 提交于 2020-03-07 07:38:07
本人正在学习ing，应该bug众多还请见谅如有转载请告知，谢谢！<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>2048</title> <style> *{ font-family: arial; margin: 0; padding: 0;}.header{ width: 500px; height: 50px; color: #000; margin: 0 auto; font-size: 48px; font-weight: bold; margin-top: 100px;}.header>span{ color: #f00;}.cell_all{ width: 500px; height: 500px; margin: 0 auto; background-color: #bbada0; border-radius: 10px;}.cell{ width: 110px; height: 110px; border: 1px solid #000; opacity: 0.95; float: left; border-radius: 9px; margin-left: 10px; margin-top: 12px; font-size: 35px; font-weight: bold;

商城项目日结5

由 早过忘川 提交于 2020-03-07 03:53:57
今天完成了商城的购物车功能 ，并细化了css样式使页面看起来更加舒适。 项目地址 购物车代码如下： html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="../lib/bootstrap/dist/css/bootstrap.css"> <link rel="stylesheet" href="../css/reset.css"> <link rel="stylesheet" href="../css/common.min.css"> <link rel="stylesheet" href="../css/index.css"> <link rel="stylesheet" href="../css/footer.css"> <link rel="stylesheet" href="../css/cart.css"> </head> <body style="background-color: #fff;"> <!-- 头部 --> <div class=

2020-03-06

由 爷，独闯天下 提交于 2020-03-07 02:30:48
今日学习 复习 1.背景 background-color background-image:url(’’)背景图片background-repeat背景图片重复方式 background-position设置背景图片位置 关键字 绝对单位 -200px -100px 可以实现css sprites技术，图片精灵技术 好处：减少访问服务器的次数 节约网络资源 实现：将所有使用背景图片的元素设置同一张背景图片，根据需要显示背景图片上不同位置上的内容background-origin设置背景图片开始的区域 padding-box从内间距开始绘制（默认） border-box从边框区开始绘制 content-box从内容区开始绘制 background-clip背景图片的裁切 padding-box从内间距开始裁切 border-box从边框区开始裁切（默认） content-box从内容区开始裁切 background-attachment设置背景图片的固定点 scroll默认值 背景图片随着滚动条滚动 fixed背景图片固定，即使内容滚动背景图片不滚动 background速写属性 [][][][ ][][<>repeat] background:fixed content-box red url(’’) center no-repeat; 哪个效率高 background

【Comprssion】《Deep Compression：Compressing Deep Neural Networks with Pruning，Trained QuantizationXXX》

由 不想你离开。 提交于 2020-03-07 02:24:39
ICLR-2016 文章目录 1 Background and Motivation 2 Advantages / Contributions 3 Method 4 Experiments 4.1 Datasets 5 Conclusion（own） / Future work 1 Background and Motivation 2 Advantages / Contributions 3 Method 4 Experiments 4.1 Datasets 5 Conclusion（own） / Future work 来源： CSDN 作者： bryant_meng 链接： https://blog.csdn.net/bryant_meng/article/details/104703548

注册页面编写（html/css）

由 南笙酒味 提交于 2020-03-06 20:53:56
图样展示 照片在WEB-INF下方的image中 照片链接： https://pan.baidu.com/s/1BhbA1J-19Y0FMokMsMtK0g 提取码：coru 特别适用于初学者 regist.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>XINGGou</title> <!-- 引入regist.css样式表文件 --> <link rel="stylesheet" href="regist.css"> </head> <body> <!-- 头部分 --> <div id="header"> <!-- 第一行 --> <div id="line1"> <img alt="logo" src="../image/logo_jt.jpg"> <span class="line"></span> <span class="regist">欢迎注册</span> </div> <!-- 第二行 --> <div id="line2"> <span> 已有帐号? <a href="#"> 请登录 </a> </span> </div> </div> <!-- 主体内容 --> <div id="body"> <form> <table> <tr><!-- 用户名输入框 --> <td>

Jquery 每天记一点2009-7-2

由 走远了吗. 提交于 2020-03-06 12:32:56
1. <script language="javascript" type="text/javascript"> $(document).ready(function(){ $("a").click(function() { alert("Hello world!"); }); }); <script> 上边的效果是点击文档中所有a标签时将弹出对话框，$("a") 是一个jQuery选择器，$本身表示一个jQuery类，所有$()是构造一个jQuery 对象，click()是这个对象的方法，同理$(document)也是一个jQuery对象，ready(fn)是$(document)的方法，表示当document全部下载完毕时 执行函数。 2. $("p")和$("#p")的区别,$("p")表示取所有p标签(<p></p>)的元素,$("#p")表示取id为"p"(<span id="p"></span>)的元素 3. 属性 我们以<img id="a" scr="5.jpg"/>为例，在原始的javascript里面可以用var o=document.getElementById('a')取的id为a的节点对象，在用 o.src来取得或修改该节点的scr属性，在jQuery里$("#a")将得到jQuery对象[ <img id="a" scr="5.jpg"/> ]
订阅 background