2021-12-12周报

目录

Python

第七章 用户输入和while循环

1.input获取字符串输入

2.while循环

3.使用while循环处理列表和字典

项目: 前端

一、消除浮动本质

二、清除浮动的方法:

1.额外标签法

2.父级添加overflow属性

 3.父级添加after伪元素

 4.父级添加双伪元素

毕设


Python

第七章 用户输入和while循环

1.input获取字符串输入

 name= input("please enter your name: ")
 print(f"\n Hello,{name}")

创建多个字符串,其中包括输入字符串

prompt = "if you tell us ,wa can"
prompt += "\nwhat is your name?"

name = input(prompt)
print(f"\nhello,{name}")

1.1 int获取数值输入

1.2 求模运算符%

2.while循环

print("\n")
current_number= 1
while current_number<=5:
    print(current_number)
    current_number+=1

prompt = "\ntell me something, and i will repeat it back to you"
prompt += "\n enter 'quit' to end the program"
message = ""
while message !='quit':
    message = input(prompt)

    if message != 'quit':
        print(message)

2.1使用标志(定义一个变量,用于判断整个程序是否处于活动状态,这个变量叫做标志)

prompt = "\ntell me something, and i will repeat it back to you"
prompt += "\n enter 'quit' to end the program"

active = True
while active:
    message = input(prompt)

    if message == 'quit':
        active = False
    else:
        print(message)

2.2 break退出循环

prompt = "\nplease enter the name of a city you have visited:"
prompt += "\n(enter 'quit' to end the program)"

while True:
    city=input(prompt)

    if city == 'quit':
        break
    else:
        print(f"i'd love to go {city.title()}!")

2.3在循环中使用continue 返回训练开头,根据条件测试结果决定是否继续执行循环

current_number=0
while current_number<10:
    current_number+=1
    if current_number%2==0:
        continue
    print(current_number)

3.使用while循环处理列表和字典

for循环是一种遍历列表的有效方式,但不应该在for循环中修改列表,否则导致python难以跟踪其中的元素。

要在遍历列表的同时对其进行修改,可使用while循环

例子:首先,创建一个待验证用户列表和一个用于存储已验证用户的空列表

unconfirmed_users=['alice','brian','candace']
confirmed_users=[]

验证每个用户,直到没有未验证用户为止

将每个经过验证的用户都转移到已验证用户列表中。

while unconfirmed_users:
    current_users=unconfirmed_users.pop()

    print(f"verifying user:{current_users.title()}")
    confirmed_users.append(current_users)

显示所有已验证的用户

print("\n the following users have been confirmed:")
for confirmed_user in confirmed_users:
    print(confirmed_user.title())

3.1删除为特定值的所有列表元素

pets=['dog','cat','dog','goldfish','cat','rabbit','cat']
print(pets)

while 'cat'in pets:
    pets.remove('cat')

print(pets)

3.2使用用户输入填充字典

responses={}
# 设置一个标志
polling_active =True

while polling_active:
    name=input("\nwhat is your name?")
    response=input("which mountain would you like to climb someday?")

    responses[name]=response

    repeat=input("would you like to let another person respond?(yes/no)")
    if repeat=='no':
        polling_active=False

print("\n--- poll results --- ")
for name,response in responses.items():
    print(f"{name} would like to climb {response}")

项目: 前端

一、消除浮动本质

1.父盒子不一定要有高度,当孩子内容会变化时,父盒子的高度也是变化的。

希望父盒子高度随子盒子内容数量变化而变化,这样通常不设置父盒子高度。但是,浮动元素不占有位置,子元素浮动,父元素高度如果没有规定,就会变成0。

2.为什么要清除浮动:父盒子很多情况下,不方便给高度,但是子盒子浮动又不占有位置,最后父级盒子高度为0时,就会影响下面的标准流盒子(下面的标准流盒子会往上跑)。

清除浮动的本质是清除浮动元素脱离标准流造成的影响。

如果父盒子本身有高度,那就不需要清除浮动。

如果父盒子没有高度,清除浮动之后,父级就会根据浮动的子盒子自动检测高度,这样父级有了高度,就不会影响下面的标准流了

语法:{clean:属性值}

left/right/both

清除左侧/右侧/两侧浮动影响(实际开发只会用both)

清除浮动的策略:闭合浮动(让子元素在父元素内部浮动)

二、清除浮动的方法:

1.额外标签法,也叫作隔墙法

2.父级添加overflow属性

3.父级添加after伪元素

4.父级添加双伪元素

1.额外标签法

额外标签法会在浮动元素末尾添加一个空标签

例如<div style="clean"></div> 或者其他标签(如<br>)

    <style>
        .box {
            width: 800px;
            border: 1px solid blue;
            margin: 0 auto;
        }

        .damao {
            float: left;
            width: 300px;
            height: 200px;
            background-color: purple;
        }

        .ermao {
            float: left;
            width: 200px;
            height: 200px;
            background-color: pink;
        }

        .footer {
            height: 200px;
            background-color: black;
        }

        .clear {
            clear: both;
        }
    </style>



<body>
    <div class="box">
        <div class="damao">大毛</div>
        <div class="ermao">二毛</div>
        <div class="clean"></div>
        <!-- 标签把浮动元素隔开 
        这样做,即使有很多孩子,也不会跑出父元素
        缺点:添加很多无意义的标签,结构化较差,(添加的标签必须是块级元素)
    -->
    </div>
    <div class="footer"></div>
</body>

2.父级添加overflow属性

可以给父级添加overflow属性,将属性值设置为hidden、auto或scroll

优点:代码简洁

缺点:无法显示溢出的部分

    <style>
        .box {
            overflow: hidden;
            /* 清除浮动 */
            width: 800px;
            border: 1px solid blue;
            margin: 0 auto;

        }

        .damao {
            float: left;
            width: 300px;
            height: 200px;
            background-color: purple;
        }

        .ermao {
            float: left;
            width: 200px;
            height: 200px;
            background-color: pink;
        }

        .footer {
            height: 200px;
            background-color: black;
        }
    </style>

</head>

<body>
    <div class="box">
        <div class="damao">大毛</div>
        <div class="ermao">二毛</div>
    </div>
    <div class="footer"></div>
</body>

 3.父级添加after伪元素

after方式是额外标签法的升级版,也是给父元素添加

原理和隔墙法相同,但是结构更清晰,没有加额外的标签

    <style>
        .clearfix:after {
            content: "";
            display: block;
            height: 0;
            clear: both;
            visibility: hidden;
        }

        .clearfix {
            *zoom: 1;
            /* 兼容低版本浏览器 */
        }

        .box {
            width: 800px;
            border: 1px solid blue;
            margin: 0 auto;

        }

        .damao {
            float: left;
            width: 300px;
            height: 200px;
            background-color: purple;
        }

        .ermao {
            float: left;
            width: 200px;
            height: 200px;
            background-color: pink;
        }

        .footer {
            height: 200px;
            background-color: black;
        }
    </style>

</head>

<body>
    <div class="box clearfix">
        <div class="damao">大毛</div>
        <div class="ermao">二毛</div>
    </div>
    <div class="footer"></div>

</body>

 4.父级添加双伪元素

原理和after伪元素相同,只不过父盒子增加前面加隔墙法

这样父盒子的前后都有元素(墙),把子元素堵在中间

优点:代码更简洁

    <style>
        .clearfix:before,
        .clearfix:after {
            content: "";
            display: table;
        }

        .clearfix:after {
            clear: both;
        }

        .clearfix {
            *zoom: 1;
            /* 兼容浏览器 */
        }


        .box {
            width: 800px;
            border: 1px solid blue;
            margin: 0 auto;

        }

        .damao {
            float: left;
            width: 300px;
            height: 200px;
            background-color: purple;
        }

        .ermao {
            float: left;
            width: 200px;
            height: 200px;
            background-color: pink;
        }

        .footer {
            height: 200px;
            background-color: black;
        }
    </style>
</head>

<body>
    <div class="box clearfix">
        <div class="damao">大毛</div>
        <div class="ermao">二毛</div>
    </div>
    <div class="footer"></div>

</body>

毕设

正在探索环境搭建和研究基础代码

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值