请老师帮忙检查

来源:2-11 编程练习

慕数据4158169

2020-11-25 18:35:33

# 具体遇到的问题

# 报错信息的截图

# 相关课程内容截图

# 尝试过的解决思路和结果

# 粘贴全部相关代码,切记添加代码注释(请勿截图)

<!DOCTYPE html>

<html>


<head>

    <meta charset="UTF-8">

    <title>边框</title>

    <style>

        /*补充代码*/

        div.bd1{

            width:0;

            height:0;

            border:100px solid transparent;

            border-right-color:red;

            border-radius:0 100px 100px 0;

        }

        div.bd2{

            width:0;

            height:0;

            border:100px solid transparent;

            border-left-color:red;

            border-radius:100px 0px 0px 100px;

            position:relative;

            bottom:200px;

        }

    </style>

</head>


<body>

    <div class="box">

        <div class="bd1"></div>

        <div class="bd2"></div>

    </div>

</body>


</html>


写回答

1回答

好帮手慕慕子

2020-11-25

同学你好,练习效果图中的蝴蝶结,中间部分没有设置圆角的,如下图所示:

http://img.mukewang.com/climg/5fbe35ed0915a71f04330258.jpg

但是同学的代码蝴蝶结全部是圆角了,如下图所示:

http://img.mukewang.com/climg/5fbe362d09c48ceb03120179.jpg

建议修改:调整border-radius属性值小于边框宽度,示例:80px。另外,相同样式的代码可以使用组合选择器书写在一起,简化书写。

http://img.mukewang.com/climg/5fbe36dd093ea79e05660740.jpg

祝学习愉快~

0

0 学习 · 15276 问题

查看课程