Correction status:qualified
Teacher's comments:
结果图:
代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>设置内联样式CSS</title> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <style type="text/css"> .container{ width: 400px; height:400px; background-color: lightgray; position: absolute; left:100px; top:100px; } img{ width: 300px; height: 300px; position: relative; top: 50px; left: 60px; } </style> </script> </head> <body> <div class="container"> <img src="https://gss3.bdstatic.com/84oSdTum2Q5BphGlnYG/timg?wapp&quality=80&size=b150_150&subsize=20480&cut_x=0&cut_w=0&cut_y=0&cut_h=0&sec=1369815402&srctrace&di=43611e0509653556bddd8365edea569b&wh_rate=null&src=http%3A%2F%2Fimgsrc.baidu.com%2Fforum%2Fpic%2Fitem%2Fb21c8701a18b87d6ad4b14bb060828381f30fd0d.jpg" alt=""> </div> </body> <script type="text/javascript"> //attr方法 $('img').attr('style','box-shadow:4px 4px 5px #888') //CSS方法 $('img').css('border-radius','10%') //width方法 $('img').width(350) //height方法 $('img').height(350) // offset方法 查询距离左边和顶部的偏移量 var res = $('img').offset().top var res = $('img').offset().left // position方法 查询在父级区块中的偏移量 var res = $('img').position().top var res = $('img').position().left $('.container').width('+=60').height('+=50') //控制台查看结果 console.log(res) </script> </html>
点击 "运行实例" 按钮查看在线实例