html5 CSS3画小米logo
🌙
手机阅读
本文目录结构
代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css3实现小米logo </title>
<style type="text/css">
body{
background-color: #ccc;
}
#main{
background-color: #f57923;
width: 415px;
height: 300px;
margin:150px auto;
border-radius: 25px;
}
#left,#right{
background-color: #fff;
margin-top:40px;
height: 220px;
}
#left{
float: left;
width: 250px;
margin-left: 35px;
border-top-right-radius: 65px;
z-index: -99999;
}
#inner{
background-color: #f57923;
width: 140px;
height: 170px;
margin-left: 55px;
margin-top: 50px;
border-top-right-radius: 40px;
z-index: 10px;
}
#center{
background-color: #fff;
position: relative;
width: 50px;
height: 125px;
top:45px;
left: 45px;
z-index:999999; }
#right{
float: right;
width: 50px;
margin-right:35px;}
</style>
</head>
<body>
<div id="main">
<div id="left">
<div id="inner">
<div id="center"></div>
</div>
</div>
<div id="right"></div>
</div>
</body>
更多面试题
如果你想了解更多的前端面试题,可以查看本站的WEB前端面试题 ,这里基本包涵了市场上的所有前端方面的面试题,也有一些大公司的面试图,可以让你面试更加顺利。
面试题 | ||
---|---|---|
HTML | CSS | JavaScript |
jQuery | Vue.js | React |
算法 | HTTP | Babel |
BootStrap | Electron | Gulp |
Node.js | 前端经验相关 | 前端综合 |
Webpack | 微信小程序 | - |
这些题库还在更新中,如果你有不错的面试题库欢迎分享给我,我整理后放上来;人人为我,我为人人,互帮互助,共同提高,祝大家都拿到心仪的Offer!