js+css实现手风琴折叠式图片墙代码
代码语言:html
所属分类:画廊相册
代码描述:js+css实现手风琴折叠式图片墙代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/normalize.5.0.css"> <style> body { margin: 0; font-family: Arial, sans-serif; background-color: #f0f0f0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100vh; } .container { display: flex; flex: 1; max-width: 1440px; padding: 0 3rem; margin: 0 auto; overflow: auto; align-items: flex-start; justify-content: center; } .card { flex: 1 1 1%; position: relative; opacity: 0.2; transition: flex 600ms cubic-bezier(0.25, 1, 0.5, 1), opacity 250ms ease; } .card:hover { flex-basis: 30%; } .card__inner { margin: 0.25rem; background: #fff; border-ra.........完整代码请登录后点击上方下载按钮下载查看
网友评论0