理想汽车的车机系统需要展示车辆的实时电量、续航里程等信息。请用 HTML 和 CSS 实现一个简单的卡片式布局，用于展示这些信息，卡片要有一定的圆角和阴影效果。

答题要点

推荐使用分层分析法来解答此题。先明确整体布局结构，再分别处理 HTML 和 CSS 部分。关键要点如下：1. HTML 结构搭建，使用 div 元素创建卡片容器，内部添加用于展示电量、续航里程等信息的子元素。2. CSS 样式设置，为卡片容器设置圆角和阴影效果，可使用 border - radius 和 box - shadow 属性。3. 信息展示样式，设置子元素的字体、颜色、间距等样式，使其清晰易读。示例思路：首先创建一个 div 元素，设置其 class 为 'car - info - card'。在这个 div 内部添加几个 p 元素，分别用于显示电量、续航里程等信息。然后在 CSS 中，为 'car - info - card' 类添加圆角和阴影样式，同时设置 p 元素的样式，如字体大小、颜色等。