列表

详情


FED14. 浮动和清除浮动

描述

请将类为"left"的div元素和类为"right"的div元素在同一行上向左浮动,且清除类为"wrap"的父级div元素内部的浮动。

原站题解

HTML/CSS/JavaScript 解法, 执行用时: 674ms, 内存消耗: 91300KB, 提交时间: 2022-03-07

{"css":"","js":"","html":"<html>\n    <head>\n        <meta charset=utf-8>\n        <style type=\"text/css\">\n            .wrap::after{\n                /*补全代码*/\n               content:'';\n                display:block;\n                clear:both;\n            }\n             .left {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                 display:block;\n                 float:left;\n            }\n             .right {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                display:block;\n                  float:left;\n            }\n        </style>\n    </head>\n    <body>\n        <div class='wrap'>\n            <div class='left'></div>\n            <div class='right'></div>\n        </div>\n    </body>\n</html>","libs":[]}

HTML/CSS/JavaScript 解法, 执行用时: 1684ms, 内存消耗: 77804KB, 提交时间: 2022-02-09

{"css":"","js":"","html":"<html>\n    <head>\n        <meta charset=utf-8>\n        <style type=\"text/css\">\n            .wrap{\n                /*补全代码*/\n               overflow:hidden;\n                \n            }\n             .left {\n                width: 100px;\n                height: 100px;\n                 float:left;\n                /*补全代码*/\n                \n            }\n             .right {\n                width: 100px;\n                height: 100px;\n                 float:left;\n                /*补全代码*/\n                \n            }\n        </style>\n    </head>\n    <body>\n        <div class='wrap'>\n            <div class='left'></div>\n            <div class='right'></div>\n        </div>\n    </body>\n</html>","libs":[]}

HTML/CSS/JavaScript 解法, 执行用时: 1693ms, 内存消耗: 77820KB, 提交时间: 2022-02-07

{"css":"","js":"","html":"<html>\n    <head>\n        <meta charset=utf-8>\n        <style type=\"text/css\">\n            .wrap::after {\n                /*补全代码*/\n                content:\"\";\n                display:block;\n                clear:both;\n            }\n             .left {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                float:left;\n            }\n             .right {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                float:left;\n            }\n        </style>\n    </head>\n    <body>\n        <div class='wrap'>\n            <div class='left'></div>\n            <div class='right'></div>\n        </div>\n    </body>\n</html>","libs":[]}

HTML/CSS/JavaScript 解法, 执行用时: 1703ms, 内存消耗: 77820KB, 提交时间: 2022-02-08

{"css":"","js":"","html":"<html>\n    <head>\n        <meta charset=utf-8>\n        <style type=\"text/css\">\n            .wrap::after {\n                /*补全代码*/\n                content:\"\";\n                display:block;\n                background-color:black;\n                clear:both;\n            }\n             .left {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                float:left;\n                background-color:red;\n            }\n             .right {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                float:left;\n                background-color:blue;\n            }\n        </style>\n    </head>\n    <body>\n        <div class='wrap'>\n            <div class='left'></div>\n            <div class='right'></div>\n        </div>\n    </body>\n</html>","libs":[]}

HTML/CSS/JavaScript 解法, 执行用时: 1746ms, 内存消耗: 77876KB, 提交时间: 2021-11-21

{"css":"","js":"","html":"<html>\n    <head>\n        <meta charset=utf-8>\n        <style type=\"text/css\">\n            .wrap {\n                /*补全代码*/\n                overflow:hidden;\n            }\n             .left {\n                width: 100px;\n                height: 100px;\n                float:left;\n                /*补全代码*/\n                \n            }\n             .right {\n                width: 100px;\n                height: 100px;\n                /*补全代码*/\n                float:left;\n            }\n        </style>\n    </head>\n    <body>\n        <div class='wrap'>\n            <div class='left'></div>\n            <div class='right'></div>\n        </div>\n    </body>\n</html>","libs":[]}

上一题