Question

我想画一个纯html和CSS的飞机。我目前的地下室是这样的： http://jsfiddle.net/SchweizerSchoggi/rq2ukwfk/

<div id="plane"></div>

#plane { 
  height: 100px;
  background-color: #ccc; 
  border: solid 1px #000; 
  border-radius: 120px 0 0 120px; 
}

我想让左侧的“驾驶舱”更加椭圆形，而不是圆形。有没有机会实现这一点？谢谢你的帮助！

Answer 1

为了让它更加椭圆，你可以使用：

border-radius: 50% 0 0 50%;

您可以在纯html和CSS中执行此操作，但您需要更多div元素。喜欢这样的东西：

<div id="plane">
    <div id="cockpit-window"></div>
    <div id="left-wing"></div>
    <div id="right-wing"></div>
    <div id="tail"></div>
</div>

为您带来一些灵感：