全套Bootstrap视频教程，Web前端响应式开发项目实战视频教程带源码

共75个文件

ds_store：33个

css：18个

html：17个

bootstrap

源码

html

Javascript

需积分: 1 120 浏览量 2023-02-08 16:56:35 上传评论 1 收藏 485.32MB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

重新整理Bootstrap视频教程.rar （75个子文件）

responsive-web-design-files

01-07

.DS_Store 6KB

orientation.html 314B

css

style.css 235B

.DS_Store 6KB

.DS_Store 24KB

01-08

.DS_Store 6KB

height-and-device-height.html 351B

css

style.css 164B

.DS_Store 6KB

03-02

.DS_Store 6KB

navigation.html 2KB

css

style.css 3KB

.DS_Store 6KB

01-10

.DS_Store 6KB

css

style.css 214B

.DS_Store 6KB

resolution.html 312B

picturefill.js 2KB

swipe.js 14KB

05-01

.DS_Store 6KB

swipe.html 2KB

css

style.css 4KB

.DS_Store 6KB

04-06

.DS_Store 6KB

picturefill.html 2KB

css

style.css 3KB

.DS_Store 6KB

02-01

.DS_Store 6KB

responsive-layout.html 1KB

css

style.css 863B

.DS_Store 6KB

01-12

.DS_Store 6KB

or.html 293B

css

style.css 205B

.DS_Store 6KB

04-01

.DS_Store 6KB

css

style.css 3KB

.DS_Store 6KB

image.html 2KB

01-11

.DS_Store 6KB

and.html 295B

css

style.css 191B

.DS_Store 6KB

01-05

.DS_Store 6KB

css

style.css 155B

.DS_Store 6KB

aspect-ratio.html 325B

01-03

.DS_Store 6KB

media-type.html 289B

css

style.css 42B

.DS_Store 6KB

print.css 42B

images

02.jpg 650KB

01.jpg 163KB

01_s_2x.jpg 210KB

03.jpg 240KB

01_s.jpg 54KB

01-13

.DS_Store 6KB

css

style.css 166B

.DS_Store 6KB

not.html 295B

01-09

.DS_Store 6KB

width-and-device-width.html 347B

css

style.css 162B

.DS_Store 6KB

00-02

viewport-1.html 770B

.DS_Store 6KB

css

style.css 2KB

viewport.css 421B

.DS_Store 6KB

viewport.html 2KB

01-06

device-aspect-ratio.html 336B

.DS_Store 6KB

css

style.css 162B

.DS_Store 6KB

<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>响应式幻灯片</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/style.css" rel="stylesheet"> <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"> <script src="../js/picturefill.js"></script> <script src="../js/swipe.js"></script> </head> <body > <header id="header"> <div class="container"> <h1>Swipe</h1> <h2>Responsive Slide</h2> </div> </header> <div class="container"> <a href="#nav" class="open toggle-btn"><i class="icon-reorder"></i></a> <nav id="nav"> <ul> <li><a href="#" class="active">项目 1</a></li> <li><a href="#">项目 2</a></li> <li><a href="#">项目 3</a></li> <li><a href="#">项目 4</a></li> <li><a href="#">项目 5</a></li> </ul> <a href="#top" class="close toggle-btn"><i class="icon-remove-sign"></i></a> </nav> <div id="showcase"> <div id='slider' class='swipe'> <div class='swipe-wrap'> <div><img src="../images/01.jpg" alt=""></div> <div><img src="../images/02.jpg" alt=""></div> <div><img src="../images/03.jpg" alt=""></div> </div> <div class="slider-control"> <button class="left" onclick="mySwipe.prev()"><i class="icon-angle-left"></i></button> <button class="right" onclick="mySwipe.next()"><i class="icon-angle-right"></i></button> </div> </div> <script> window.mySwipe = Swipe(document.getElementById('slider')); </script> </div> <article id="mainbody"> <h3>主体</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sem erat, egestas quis luctus ut, rhoncus vitae risus. Integer venenatis libero sit amet sapien dictum, quis bibendum mi volutpat. Cras pretium quam quis magna facilisis, eget feugiat nisi lacinia.</p> </article> <aside id="sidebar"> <h3>边栏</h3> <p>Donec dolor arcu, interdum sed turpis faucibus, placerat ultricies felis. Donec pulvinar gravida rhoncus. </p></aside> </div> <footer id="footer"> <div class="container"> <h5>© Copyright Ninghao.net</h5> </div> </footer> </body> </html>

评论收藏

内容反馈