用pycharm新建chouti.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
		.head-box{
			background-color: #2459a2;
			height: 44px;
			width: 100%;
			position: fixed;
		}
	</style>
</head>
<body>

<div class="head-box">
    <div class="head-content">

        <a href="#" class="logo"></a>
    </div>
</div>
</body>
</html>

点击pycharm上面浏览器

修改chouti.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
	    body{
	        margin: 0;
	    }

		.head-box{
			background-color: #2459a2;
			height: 44px;
			width: 100%;
			position: fixed;
		}
	</style>
</head>
<body>

<div class="head-box">
    <div class="head-content">

        <a href="#" class="logo"></a>
    </div>
</div>
</body>
</html>

点击pycharm上面浏览器

修改chouti.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
	    *{
	        margin: 0;
	        padding: 0;
	    }

		.head-box{
			background-color: #2459a2;
			height: 44px;
			width: 100%;
			position: fixed;
		}
	</style>
</head>
<body>

<div class="head-box">
    <div class="head-content">

        <a href="#" class="logo"></a>
    </div>
</div>

<div style="height: 1000px;background-color:red"></div>
</body>
</html>

点击pycharm上面浏览器

修改chouti.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
	    *{
	        margin: 0;
	        padding: 0;
	    }

		.head-box{
			background-color: #2459a2;
			height: 44px;
			width: 100%;
			position: fixed;
			top: 0;
			left: 0;
		}
	</style>
</head>
<body>

<div class="head-box">
    <div class="head-content">

        <a href="#" class="logo"></a>
    </div>
</div>

<div style="height: 1000px;background-color:red"></div>
</body>
</html>

点击pycharm上面浏览器

修改chouti.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
	    *{
	        margin: 0;
	        padding: 0;
	    }

		.head-box{
			background-color: #2459a2;
			height: 44px;
			width: 100%;
			position: fixed;
			top: 0;
			left: 0;
		}

		.head-content{
		    margin: 0 auto;
		    width: 1016px;
		    height: 44px;
		    background-color: green;
		}
	</style>
</head>
<body>

<div class="head-box">
    <div class="head-content">

        <a href="#" class="logo"></a>
    </div>
</div>
</body>
</html>

点击pycharm上面浏览器

修改chouti.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
	    *{
	        margin: 0;
	        padding: 0;
	    }

		.head-box{
			background-color: #2459a2;
			height: 44px;
			width: 100%;
			position: fixed;
			top: 0;
			left: 0;
		}

		.head-content{
		    margin: 0 auto;
		    width: 1016px;
		    height: 44px;
		    background-color: green;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;

		}
	</style>
</head>
<body>

<div class="head-box">
    <div class="head-content">

        <a href="#" class="logo"></a>
    </div>
</div>
</body>
</html>

点击pycharm上面浏览器