Mouse In and Out遇到的问题

行内样式>页内style标签内的样式>外部css文件

行内样式,style样式和外部css文件都可以通过js动态修改。页面渲染完之后在外部加一个id或者class,通过这个来定位并修改。举个例子,比如改变img的width:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="content-type" content="text/html" charset="utf-8">
        <title>Mouse in and out</title>
        <script type="text/javascript" src="file:///Users/xurm/Desktop/mouseInOut.js"></script>
        <link type="text/css" rel="stylesheet" href="file:///Users/xurm/Desktop/mouseInOut.css" /> 
    </head>
    <body>
        <ul>
            <div class="images">
                <li><img src="file:///Users/xurm/Documents/pic/穿搭1.jpg" style="width:227px"; /></li>
                <li><img src="file:///Users/xurm/Documents/pic/穿搭2.jpg" style="width:227px"; /></li>
            </div>
        </ul>
    </body>
</html>

<script type="text/javascript" src="file:///Users/xurm/Desktop/jquery-3.3.1.js"></script>
<script>
    $(document).ready(function(){
        $("img").css("width","127px");
    });
</script>

jQuery自定义函数

$(document).ready(function(){
    $(function(){
        blabla;
    });
});

网页内容放在网页中央:

<div class="mainbody"></div>

<style>
    .mainbody{
        margin-left:auto;
        margin-right:auto;
    }
</style>

猜你喜欢

转载自blog.csdn.net/its_noah/article/details/81946731