gpt4 book ai didi

android - 用于网页的 CardView

转载 作者:搜寻专家 更新时间:2023-11-01 08:26:50 26 4
gpt4 key购买 nike

在 Android 上有一个名为 CardView 的组件,它显示一个像卡片一样的盒子,带有圆 Angular 、阴影等。我愿意在 HTML 中实现同样的事情,是否有任何库、CSS 或示例来实现它?

最佳答案

以下链接提供了与卡片相关的各种示例

https://www.w3schools.com/howto/howto_css_cards.asp

或者您可以尝试使用 bootsnipp,其中会提供代码 fragment

下面是示例代码

 <!DOCTYPE html>
<html>
<head>
<style>
.card {
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
transition: 0.3s;
width: 40%;
border-radius: 5px;
}

.card:hover {
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

img {
border-radius: 5px 5px 0 0;
}

.container {
padding: 2px 16px;
}
</style>
</head>
<body>

<h2>Round Card</h2>

<div class="card">
<img src="img_avatar2.png" alt="Avatar" style="width:100%">
<div class="container">
<h4><b>Jane Doe</b></h4>
<p>Interior Designer</p>
</div>
</div>

</body>
</html>

关于android - 用于网页的 CardView,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44129350/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com