抽屉页面head的menu设置

修改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;
		    margin-top: 11px;

		}
	</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;*/
		    margin-top: 11px;

		}
	</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;*/
		    margin-top: 11px;
		    display: inline-block;

		}
	</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;*/
		    margin-top: 11px;
		    display: inline-block;

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

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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;*/
		    margin-top: 11px;
		    display: inline-block;

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

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </div>
</div>
</body>
</html>

点击pycharm上面浏览器

用pycharm新建ceshi.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            background-color: #cc3399;
        }
    </style>
</head>
<body>

<div>smoke</div>

</body>
</html>

点击pycharm上面浏览器

修改ceshi.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            background-color: #cc3399;
            height: 50px;
        }
    </style>
</head>
<body>

<div>smoke</div>

</body>
</html>

点击pycharm上面浏览器

修改ceshi.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            background-color: #cc3399;
            height: 50px;
            text-align: center;
        }
    </style>
</head>
<body>

<div>smoke</div>

</body>
</html>

点击pycharm上面浏览器

修改ceshi.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            background-color: #cc3399;
            height: 50px;
            /*text-align: center;*/
            line-height: 50px;
        }
    </style>
</head>
<body>

<div>smoke</div>

</body>
</html>

点击pycharm上面浏览器

修改ceshi.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            background-color: #cc3399;
            height: 280px;
            /*text-align: center;*/
            line-height: 220px;
        }
    </style>
</head>
<body>

<div>smoke</div>

</body>
</html>

点击pycharm上面浏览器

修改chouti.html文件

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

        a{
            text-decoration: none
        }

		.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;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}

		.action-menu a.tb{
			color: #c0cddf;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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: #2459a2;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}

		.action-menu a.tb{
			color: #c0cddf;
			margin-left: -3px;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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: #2459a2;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}

		.action-menu a.tb{
			color: #c0cddf;
			margin-left: -8px;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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: #2459a2;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}

		.action-menu a.tb{
			color: #c0cddf;
			margin-left: -8px;
			padding: 0 13px 0 13px;
			display: inline-block;
			background-color: yellow;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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: #2459a2;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}

		.action-menu a.tb{
			color: #c0cddf;
			margin-left: -8px;
			padding: 0 13px 0 13px;
			display: inline-block;
			background-color: yellow;
		}

		.action-menu a.tb:hover{
			color: #fff;
			background-color: #c0cddf;
		}
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </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;
	    }

        a{
            text-decoration: none
        }

		.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: #2459a2;
		    line-height: 44px;
		}

		.logo{
		    background: url("images/logo.png") no-repeat 0 0;
		    height: 23px;
		    width: 121px;
		    float: left;
		    margin-top: 11px;
		    /*display: inline-block;*/

		}

		.action-menu{
            float: left;
            margin-left: 20px;
		}

		.action-menu a.tb{
			color: #c0cddf;
			margin-left: -8px;
			padding: 0 13px 0 13px;
			display: inline-block;
			/*background-color: yellow;*/
		}

		.action-menu a.tb:hover{
			color: #fff;
			background-color: #c0cddf;
		}

		.action-menu a.active,.action-menu a.active:hover{
			color: #fff
			background-color: #204982
		}
		
	</style>
</head>
<body>

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

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



        <div class="action-menu">

				    <a href="#" class="tb active">全部</a>
					<a href="#" class="tb">42区</a>
					<a href="#" class="tb">段子</a>
					<a href="#" class="tb">图片</a>
					<a href="#" class="tb">挨踢1024</a>
					<a href="#" class="tb">你问我答</a>
        </div>
    </div>
</div>
</body>
</html>

点击pycharm上面浏览器