glightbox实现一个图片相册点击放大图片效果代码
代码语言:html
所属分类:图片放大
代码描述:glightbox实现一个图片相册点击放大图片效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> <style> html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } li { margin-bottom: 10px; } .section { padding: 95px 0; } body { font-family: 'Gilroy', sans-serif; background: #fff; color: #666; font-size: 16px; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif !important; } a, a:hover { text-decoration: none; color: #000; } .text-center { text-align: center; } .pair { background: #f8f8f8; } @media (min-width: 1200px) { .container { max-width: 1040px; } } header { position: absolute; width: 100%; top: 0; left: 0; border-bottom: 1px solid transparent; z-index: 999; transition: all 0.3s ease-in-out; } header.fixed { background: #fff; border-bottom: 1px solid #cecece; } .header-unpin { position: fixed; opacity: 0; transform: translate3d(0, -100%, 0); transition: all 0.3s ease-in-out; } .header-pin { position: fixed; background: #fff; opacity: 1; border-bottom: 1px solid #cecece; transform: translate3d(0,.........完整代码请登录后点击上方下载按钮下载查看
网友评论0