h1 {textalign: center; marginbottom: 20px}
.albumcontainer {
display: flex;
justifycontent: center;
margin: 50px 0;
}
.photogrid {
display: grid;
gridtemplatecolumns: repeat(autofit, minmax(200px, 1fr));
gap: 20px;
padding: 20px;
border: 1px solid ccc;
boxshadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.photoitem {
textalign: center;
cursor: pointer;
transition: opacity 0.3s;
}
.photoitem:hover {
opacity: 0.8;
}
.year {
fontweight: bold;
marginbottom: 5px;
}
1956年
// 假设你有获取历届全明星数据的API,可以在这里动态添加
// 例如,使用fetch或axios获取数据,然后替换下面的HTML
fetch('https://api.nbaallstarphotos.com/years')
.then(res => res.json())
.then(data => {
data.forEach(year => {
const photo = document.createElement('div');
photo.classList.add('photoitem');
photo.src = year.photoUrl;
photo.alt = year.year;
photo.dataset.year = year.year;
photo.textContent = year.year;
document.querySelector('.photogrid').appendChild(photo);
});
})
.catch(error => console.error('加载数据出错', error));