Python-day16

最新推荐文章于 2024-05-07 17:04:53 发布

Charlie彬

最新推荐文章于 2024-05-07 17:04:53 发布

阅读量171

点赞数

文章标签： stylesheet

本文链接：https://blog.csdn.net/qq_34001852/article/details/78540303

版权

运维自动化专栏收录该内容

18 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css2.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.css">
</head>
<body style="margin: 0 auto">
<div class="pg_header">
    <div class="logo">
        老男孩
        <i class="fa fa-life-ring" aria-hidden="true"></i>
    </div>
    <div class="user">
        <a class="a" href="http://soccer.hupu.com">
            <img src="cr7.jpeg">
        </a>
        <div class="b">
            <a>我的资料</a>
            <a>注销账号</a>
            <a>忘记密码</a>
            <a>退出</a>
        </div>
    </div>
    <div class="icons right">
        <i class="fa fa-superpowers" aria-hidden="true"></i>
        <spa>5</spa>
    </div>
    <div class="icons right">
        <i class="fa fa-lemon-o" aria-hidden="true"></i>
    </div>
</div>
<div class="pg_content">
    <div class="menu"></div>
    <div class="content">
        <div class="p_content">
            <p style="margin: 0;">皇家马德里
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
            <p>皇家马德里</p>
        </div>
    </div>
    <div class="return_top">返回顶部</div>
</div>
</div>
</body>
</html>

.pg_header {
    width: 100%;
    color: white;
    background-color: #2459a2;
    height: 50px;
    line-height: 50px;
}

.pg_content .menu {
    position: absolute;
    top: 50px;
    left: 0;
    bottom: 0;
    width: 15%;
    background-color: #337ab7;
}

.pg_content .content {
    position: absolute;
    z-index: 9;
    top: 50px;
    right: 0;
    bottom: 0;
    width: 85%;
    /*加入下面这条可以实现两种不同的样式*/
    /*overflow: auto;*/
}

.pg_header .logo{
    width: 15%;
    height: 50px;
    background-color: darkcyan;
    text-align: center;
    float: left;
}

.pg_header .user{
    margin-right: 60px;
    padding: 0 20px;
    line-height: 50px;
    text-align: left;
    float: right;
}

.pg_header .user .b{
    width: 13%;
    background-color: #ff2066;
    position: absolute;
    z-index: 15;
    right: 0;
    top: 50px;
    display: none;
}

.pg_header .user .b a{
    display: block;
}

.pg_header .user .a img{
    width: 35px;
    height: 27px;
    border-radius: 50%;
    margin-top: 11.5px;

}

.pg_header .user:hover{
    background-color: #337ab7;
}

.pg_header .user:hover .b{
    display: block;
}

.p_content{
    background-color: #9853c7;
}

.return_top{
    /*第一次定位，可以在指定位置*/
    /*position: absolute;   */
    position: fixed;
    bottom: 50px;
    width: 30px;
    height: 50px;
    right: 0;
}

.right{
    float: right;
}

.left{
    float: left;
}

.pg_header .icons{
    padding: 0 10px;
}

.pg_header .icons:hover{
    background-color: darkslateblue;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div style="width: 100%;text-align: center">
    <input id="id1" onfocus="Focus()" onblur="Blur()" type="text" value="请输入关键字">
</div>
<script>
    function Focus() {
        var tag = document.getElementById("id1")
        var value = tag.value
        if(value == "请输入关键字"){
//            value = ""
            tag.value = ""
        }
    }

    function Blur() {
        var tag = document.getElementById("id1")
        var value = tag.value
        if(value.length==0){
//            value = "请输入关键字"
            tag.value = "请输入关键字"
        }
    }
</script>
</body>
</html>

#!/usr/bin/env python3
# this is Charlie scripts!

# 在其他语言中，以{}作为作用域，在Python中以函数作为作用域，包括Javascript\
# 并且在函数未被执行之前，作用域已经被创建了

# 函数内部变量会提前声明变量，每个局部变量都会执行var xxoo;提前赋值“undefine”

Charlie彬

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Python-day16

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="css2.css"> <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awes
复制链接

扫一扫