<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery的background获取问题</title>
<style type="text/css">
.demo {
font:12px/24px Verdana, Geneva, sans-serif;
background:#F00;
width:200px;
height:200px;
margin:10px;
/*margin:10px 20px; //取消此注释,将导致js错误*/
}
.show {
border:solid 1px #000;
}
</style>
<script type="text/javascript" src="js/jQuery-1.7.1.js"></script>
<script type="text/javascript">
$(function() {
var html = '';
var bg = $('.demo').css('background');
html += 'background :' + bg + '<br />';
var bgC = $('.demo').css('backgroundColor');
html += 'background-color :' + bgC + '<br />';
var font = $('.demo').css('font');
html += 'font :' + font + '<br />';
var fontS = $('.demo').css('fontSize');
html += 'font-size :' + fontS + '<br />';
var margin = $('.demo').css('margin');
html += 'margin :' + margin + '<br />';
var marginT = $('.demo').css('marginTop');
html += 'margin-top :' + marginT + '<br />';
$('.show').html(html);
})
</script>
</head>
<body>
<div class="demo">哈哈哈哈哈哈哈哈哈哈哈哈哈哈</div>
<div class="show"></div>
</body>
</html>
ie下
background :undefined
background-color :#f00
font :undefined
font-size :12px
margin :10px
margin-top :10px
chrome下
background :rgb(255, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box
background-color :rgb(255, 0, 0)
font :normal normal normal 12px/24px Verdana, Geneva, sans-serif
font-size :12px
margin :10px
margin-top :10px
分享到:
相关推荐
提示:jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合。在本教程接下来的章节,您将学习到更多有关选择器的语法。 文档就绪函数 您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready ...
jQuery 1.1.3(2007年7月):这次小版本变化包含了对jQuery选择符引擎执行速度的显著提升。从这个版本开始,jQuery的性能达到了Prototype、Mootools以及Dojo等同类JavaScript库的水平。 jQuery 1.2(2007年9月):...
css+div生成相位角 三项电流相位角 <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"> *{padding: 0;margin: 0 auto;} .allContent { margin-top: 200px; width: 300px; height: ...
本文实例讲述了jQuery实现的简单歌词滚动功能。分享给大家供大家参考,具体如下: jquery实现歌词滚动 1.css /* CSS Document */ * { margin: 0; padding: 0; font-size: 12px; } body { background: none; }...
本文实例讲述了jQuery+css实现的切换图片功能代码。分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE html> <html> <head> <title>demo</title> ...
本文实例讲述了jQuery+CSS实现的标签页效果。分享给大家供大家参考,具体如下: CSS代码: #tabs{ width:600px; height:250px; background:white; margin:20px; } #tabs ul{ float:left; margin:20px 0 0 20...
*{ margin:0; padding:0; border:0; list-style:none} img{ display:block; border:0} body{ padding:50px;} .switch{ width:320px; height:280px; border:1px #CCCCCC solid; padding:3px;} .switch .pic_box{width...
style type="text/css"> .egg { width: 750px; height: 500px; margin: 50px auto 20px auto; background: url(images/bg.jpg); position: relative; } .egg ul li { z-index: 999; } .eggList ...
本文实例讲述了jQuery+css实现的换页标签栏效果。分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE html> <html> <head> <title>index</title> ...
margin:7px 6px 9px 0;vertical-align:middle}.bdsug .bdsug-direct p span{margin-left:8px}.bdsug .bdsug-direct p i{font-size:12px;line-height:100%;font-style:normal;font-weight:normal;color:#fff;...
<script type='text/javascript' src='http://www.ic678.com/taobao/js/jquery-1.7.2.min.js'> img{border:0} #slideshow{position: relative;height: 300px;width: 930px;margin: 0 auto;} #slideshow a{float: ...
有时我们可能会需要使用 jQuery 来加载一个外部的 css 文件,如在切换页面布局时。思路是创建一个 link 元素,并将它添加到 标记中即可,下边首先看看怎么使用 jQuery 来实现。 下边是我喜欢的写法: $("<link&...
padding: 7px 6px; line-height: 18px; height: 18px; } .j_prompt_select .select { background-color: #e8f4ff; } .j_prompt_select ul li .last { float: right; } .j_prompt_select ul li .first ...
<style type="text/css"> * {line-height: 150%} .image {text-align: center; line-height: 590px; margin: 30px auto 0px; width: 850px; height: 620px} .image img { overflow:hidden} img {border:0px} #photo_...
<link rel="stylesheet" type="text/css" href="css/jquery.classycountdown.css" /> .ClassyCountdownDemo { margin:0 auto 30px auto; max-width:800px; width:calc(100%); padding:30px; display:block } #...
jQuery折叠菜单,自适应浏览器高度 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <title> NarBar table ; charset=gb2312" ...
本文实例为大家分享了jquery实现吸顶导航效果的具体代码,供大家参考,具体内容如下 css: *{margin:0;padding:0;} body{ margin:0 auto; max-width:10rem; } header{ width:10rem; height:1rem; ...
本文实例讲述了jQuery事件绑定。分享给大家供大家参考,具体如下: style.css *{margin:0;padding:0;} body { font-size: 13px; line-height: 130%; padding: 60px } #panel { width: 300px; border: 1px solid #...
jQuery 弹窗 对话框 拖动 非插件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ; charset=utf-8" /> 资源网 ...