html相册代码大全,前端面试试题
HTML相册代码通常涉及到图片的展示,可以使用<img>
标签来实现。以下是一个简单的HTML相册示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Simple Photo Gallery</title>
<style>
#gallery {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
#gallery img {
margin: 5px;
width: 150px;
height: 150px;
object-fit: cover;
}
</style>
</head>
<body>
<div id="gallery">
<img src="photo1.jpg" alt="Photo 1">
<img src="photo2.jpg" alt="Photo 2">
<img src="photo3.jpg" alt="Photo 3">
<!-- 更多图片 -->
</div>
</body>
</html>
在这个例子中,我们创建了一个简单的相册,其中包含多张图片。图片被包含在一个<div>
元素中,每个图片由<img>
标签定义,并通过CSS进行样式化。
这只是一个基本示例,实际应用中可能需要更复杂的JavaScript来实现更多高级功能,如图片预览、图片滚动加载等。
评论已关闭