【免费】网页设计咖啡厅官网模板.zip（100%响应式,HTML5+CSS3+Bootstrap）资源-CSDN下载

共174个文件

jpg：58个

js：36个

css：28个

html

网页设计

毕业设计

css3

需积分: 0 39 浏览量更新于2023-01-29 2 收藏 8.66MB ZIP 举报

内容概要：该模板代码结构非常清晰，css脚本和js脚本独立，html各个模块均有注释，代码质量非常高。适合人群：学生网页设计作业非常合适，如果想做企业官网也非常受用，拿来改改就能用网站特色： 100%流体响应清洁代码在真实设备上测试灵活的布局无限侧边栏平面、现代和干净的设计。清洁和注释代码自定义字体支持建立在Bootstrap5上 HTML5 和 CSS3 文件无限的博客页面跨浏览器兼容性详细的定向列表视差效果

收起资源包目录

网页设计咖啡厅官网模板.zip（100%响应式,HTML5+CSS3+Bootstrap）（174个子文件）

bootstrap(1).css 147KB

bootstrap.css 147KB

bootstrap(1).css 146KB

bootstrap.css 146KB

animate.min(1).css 52KB

animate.min.css 52KB

main.css 43KB

main(1).css 43KB

font-awesome.min(1).css 30KB

font-awesome.min.css 30KB

bootstrap-grid.css 24KB

bootstrap-grid(1).css 24KB

jquery.DonutWidget.min(1).css 13KB

jquery.DonutWidget.min.css 13KB

pages(1).css 8KB

pages.css 8KB

linearicons(1).css 8KB

linearicons.css 8KB

magnific-popup(1).css 7KB

magnific-popup.css 7KB

bootstrap-reboot.css 5KB

bootstrap-reboot(1).css 5KB

owl.carousel.css 4KB

owl.carousel(1).css 4KB

nice-select(1).css 4KB

nice-select.css 4KB

jquerysctipttop.css 736B

jquerysctipttop(1).css 736B

.DS_Store 6KB

(1).DS_Store 6KB

fontawesome-webfont.eot 162KB

fontawesome-webfont(1).eot 162KB

Linearicons-Free(1).eot 55KB

Linearicons-Free.eot 55KB

elements.html 34KB

elements(1).html 34KB

index(1).html 19KB

index.html 19KB

generic(1).html 12KB

generic.html 12KB

header-bg.jpg 944KB

header-bg(1).jpg 944KB

footer-bg.jpg 471KB

footer-bg(1).jpg 471KB

menu-bg.jpg 374KB

menu-bg(1).jpg 374KB

g3.jpg 238KB

g3(1).jpg 238KB

g7.jpg 154KB

g7(1).jpg 154KB

g1(1).jpg 122KB

g1.jpg 122KB

g4(1).jpg 117KB

g4.jpg 117KB

video-bg.jpg 116KB

video-bg(1).jpg 116KB

g2.jpg 114KB

g2(1).jpg 114KB

g2.jpg 111KB

g2(1).jpg 111KB

手淘扫码购买素材.jpg 103KB

手淘扫码购买素材(1).jpg 103KB

g1(1).jpg 91KB

g1.jpg 91KB

g4(1).jpg 83KB

g4.jpg 83KB

b1.jpg 83KB

b1(1).jpg 83KB

g3.jpg 80KB

g3(1).jpg 80KB

g5(1).jpg 75KB

g5.jpg 75KB

b2.jpg 75KB

b2(1).jpg 75KB

g6.jpg 73KB

g6(1).jpg 73KB

g5(1).jpg 63KB

g5.jpg 63KB

g8.jpg 16KB

g8(1).jpg 16KB

d.jpg 14KB

d(1).jpg 14KB

f3.jpg 2KB

f3(1).jpg 2KB

f2.jpg 2KB

f2(1).jpg 2KB

f1.jpg 2KB

f1(1).jpg 2KB

f5(1).jpg 2KB

f5.jpg 2KB

f4.jpg 2KB

f4(1).jpg 2KB

f7.jpg 1KB

f7(1).jpg 1KB

f6(1).jpg 1KB

f6.jpg 1KB

f8.jpg 1KB

f8(1).jpg 1KB

jquery-2.2.4.min(1).js 84KB

jquery-2.2.4.min.js 84KB

共 174 条

身份认证购VIP最低享 7 折!

30元优惠券

资源推荐

资源预览

资源评论

<!DOCTYPE html> <html lang="zxx" class="no-js"> <head>  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">  <link rel="shortcut icon" href="img/elements/fav.png">  <meta name="author" content="colorlib">  <meta name="description" content="">  <meta name="keywords" content="">  <meta charset="UTF-8">  <title>Coffee</title> <link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">  <link rel="stylesheet" href="css/linearicons.css"> <link rel="stylesheet" href="css/owl.carousel.css"> <link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/nice-select.css"> <link rel="stylesheet" href="css/magnific-popup.css"> <link rel="stylesheet" href="css/bootstrap.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header id="header" id="home"> <div class="header-top"> <div class="container"> <div class="row justify-content-end"> <div class="col-lg-6 col-sm-4 col-8 header-top-right no-padding"> <ul> <li> Mon-Fri: 8am to 2pm </li> <li> Sat-Sun: 11am to 4pm </li> <li> <a href="tel:(012) 6985 236 7512">(012) 6985 236 7512</a> </li> </ul> </div> </div> </div> </div> <div class="container"> <div class="row align-items-center justify-content-between d-flex"> <div id="logo"> <a href="index.html"><img src="img/logo.png" alt="" title="" /></a> </div> <nav id="nav-menu-container"> <ul class="nav-menu"> <li class="menu-active"><a href="index.html#home">Home</a></li> <li><a href="index.html#about">About</a></li> <li><a href="index.html#coffee">Coffee</a></li> <li><a href="index.html#review">Review</a></li> <li><a href="index.html#blog">Blog</a></li> <li class="menu-has-children"><a href="">Pages</a> <ul> <li><a href="generic.html">Generic</a></li> <li><a href="elements.html">Elements</a></li> </ul> </li> </ul> </nav> </div> </div> </header>  <section class="generic-banner"> <div class="container"> <div class="row height align-items-center justify-content-center"> <div class="col-lg-10"> <div class="generic-banner-content"> <h2 class="text-white">The Elements Page</h2> <p class="text-white">It won’t be a bigger problem to find one video game lover in your <br> neighbor. Since the introduction of Virtual Game.</p> </div> </div> </div> </div> </section>   <section class="sample-text-area"> <div class="container"> <h3 class="text-heading">Text Sample</h3> <p class="sample-text"> Every avid independent filmmaker has <b>Bold</b> about making that <i>Italic</i> interest documentary, or short film to show off their creative prowess. Many have great ideas and want to “wow” the<sup>Superscript</sup> scene, or video renters with their big project. But once you have the<sub>Subscript</sub> “in the can” (no easy feat), how do you move from a <del>Strike</del> through of master DVDs with the <u>“Underline”</u> marked hand-written title inside a secondhand CD case, to a pile of cardboard boxes full of shiny new, retail-ready DVDs, with UPC barcodes and polywrap sitting on your doorstep? You need to create eye-popping artwork and have your project replicated. Using a reputable full service DVD Replication company like PacificDisc, Inc. to partner with is certainly a helpful option to ensure a professional end result, but to help with your DVD replication project, here are 4 easy steps to follow for good DVD replication results: </p> </div> </section>   <section class="button-area"> <div class="container border-top-generic"> <h3 class="text-heading">Sample Buttons</h3> <div class="button-group-area"> <a href="#" class="genric-btn default">Default</a> <a href="#" class="genric-btn primary">Primary</a> <a href="#" class="genric-btn success">Success</a> <a href="#" class="genric-btn info">Info</a> <a href="#" class="genric-btn warning">Warning</a> <a href="#" class="genric-btn danger">Danger</a> <a href="#" class="genric-btn link">Link</a> <a href="#" class="genric-btn disable">Disable</a> </div> <div class="button-group-area mt-10"> <a href="#" class="genric-btn default-border">Default</a> <a href="#" class="genric-btn primary-border">Primary</a> <a href="#" class="genric-btn success-border">Success</a> <a href="#" class="genric-btn info-border">Info</a> <a href="#" class="genric-btn warning-border">Warning</a> <a href="#" class="genric-btn danger-border">Danger</a> <a href="#" class="genric-btn link-border">Link</a> <a href="#" class="genric-btn disable">Disable</a> </div> <div class="button-group-area mt-40"> <a href="#" class="genric-btn default radius">Default</a> <a href="#" class="genric-btn primary radius">Primary</a> <a href="#" class="genric-btn success radius">Success</a> <a href="#" class="genric-btn info radius">Info</a> <a href="#" class="genric-btn warning radius">Warning</a> <a href="#" class="genric-btn danger radius">Danger</a> <a href="#" class="genric-btn link radius">Link</a> <a href="#" class="genric-btn disable radius">Disable</a> </div> <div class="button-group-area mt-10"> <a href="#" class="genric-btn default-border radius">Default</a> <a href="#" class="genric-btn primary-border radius">Primary</a> <a href="#" class="genric-btn success-border radius">Success</a> <a href="#" class="genric-btn info-border radius">Info</a> <a href="#" class="genric-btn warning-border radius">Warning</a> <a href="#" class="genric-btn danger-border radius">Danger</a> <a href="#" class="genric-btn link-border radius">Link</a> <a href="#" class="genric-btn disable radius">Disable</a> </div> <div class="button-group-area mt-40"> <a href="#" class="genric-btn default circle">Default</a> <a href="#" class="genric-btn primary circle">Primary</a> <a href="#" class="genric-btn success circle">Success</a> <a href="#" class="genric-btn info circle">Info</a> <a href="#" class="genric-btn warning circle">Warning</a> <a href="#" class="genric-btn danger circle">Danger</a> <a href="#" class="genric-btn link circle">Link</a> <a href="#" class="genric-btn disable circle">Disable</a> </div> <div class="button-group-area mt-10"> <a href="#" class="genric-btn default-border circle">Default</a> <a href="#" class="genric-btn primary-border circle">Primary</a> <a href="#" class="genric-btn success-border circle">Success</a> <a href="#" class="genric-btn info-border circle">Info</a> <a href="#" class="genric-btn warning-border circle">Warning</a> <a href="#" class="genric-btn danger-border circle">Danger</a> <a href=