使用CSS3画一个苹果笔记本"使用CSS3画一个苹果笔记本： ```html <!DOCTYPE html> <htm

"使用CSS3画一个苹果笔记本：

<!DOCTYPE html>
<html>
<head>
  <style>
    .notebook {
      width: 400px;
      height: 500px;
      background-color: #f8f8f8;
      border-radius: 30px;
      position: relative;
      overflow: hidden;
    }

    .notebook::before {
      content: \"\";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      background-color: #000;
      border-top-left-radius: 30px;
      border-top-right-radius: 30px;
    }

    .notebook::after {
      content: \"\";
      position: absolute;
      top: 10px;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #fff;
      border-radius: 30px;
    }

    .notebook .screen {
      position: absolute;
      top: 20px;
      left: 20px;
      width: 360px;
      height: 460px;
      background-color: #fff;
      border-radius: 20px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }

    .notebook .keyboard {
      position: absolute;
      bottom: 20px;
      left: 20px;
      width: 360px;
      height: 60px;
      background-color: #f2f2f2;
      border-radius: 10px;
      display: flex;
      justify-content: space-between;
      padding: 10px;
    }

    .notebook .keyboard .key {
      width: 30px;
      height: 30px;
      background-color: #ccc;
      border-radius: 5px;
    }

    .notebook .keyboard .key:nth-child(even) {
      background-color: #bbb;
    }

    .notebook .keyboard .key:nth-child(3n) {
      background-color: #aaa;
    }
  </style>
</head>
<body>
  <div class=\"notebook\">
    <div class=\"screen\"></div>
    <div class=\"keyboard\">
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
      <div class=\"key\"></div>
    </div>
  </div>
</body>
</html>

这段代码使用了CSS3的一些属性和选择器，通过设置宽高、背景色、边框半径等样式，实现了一个苹果笔记本的效果。其中，.notebook 是整个笔记本的容器，.screen 是屏幕部分的容器，.keyboard 是键盘部分的容器，.key 是键盘的按键。

通过设置不同的样式，比如背景色、边框半径等，可以调整笔记本的外观。可以根据自己的需求进行修改和优化。

上述代码可以直接在浏览器中运行，就可以看到一个用CSS3画出的苹果笔记本的效果。"