养生科技公司大气宽屏bootstrap模板_html网站模板_网页源码移动端前端_H5模板

共157个文件

scss：91个

jpg：25个

js：13个

47 浏览量 2023-08-05 11:51:46 上传评论收藏 3.18MB RAR 举报

该压缩包文件包含的是一款专为养生科技公司设计的大气宽屏HTML网站模板，采用了流行的Bootstrap框架，确保了页面在不同设备上的自适应响应式布局。这个模板适用于想要展示其健康科技产品或服务的企业，提供了现代化的设计风格和良好的用户体验。 Bootstrap是一个广泛使用的开源前端开发框架，它简化了网页设计和开发过程。它包含了一套CSS和JavaScript组件，能够快速构建响应式和移动优先的网站。在这个模板中，Bootstrap的网格系统、导航栏、模态框、按钮、表单元素等都被巧妙地应用，使得网站布局整齐且易于导航。模板的设计风格是大气且扁平化的，采用了黑色和蓝色调，给人一种专业且科技感十足的印象。黑色通常代表稳重和专业，而蓝色则常用于科技领域，寓意着创新和技术。这种配色方案有助于塑造养生科技公司的品牌形象。 HTML5作为现代网页开发的标准，提供了更多的语义化标签，如<header>、<footer>、<section>等，这些在模板中都有所体现，有助于搜索引擎优化（SEO）和提高内容可读性。同时，HTML5也支持音频、视频等多媒体元素的嵌入，使得网站内容更加丰富多彩。 CSS3在模板中起到了关键的美化作用。它允许使用更丰富的样式，如过渡、动画和3D效果。在这个模板中，可能可以看到一些CSS3动画效果，比如按钮悬停效果、滑动展示等，提升了用户的交互体验。此外，模板还包含了JavaScript，这是一种广泛使用的客户端脚本语言，用于增加网页的动态功能。JavaScript可能被用来实现页面的交互效果，如滚动监听、表单验证、轮播图等，增强了用户的参与度。这个“养生科技公司大气宽屏bootstrap模板”结合了Bootstrap的响应式设计、HTML5的语义化结构、CSS3的美化效果以及JavaScript的交互功能，为养生科技类企业提供了展示自身、吸引客户的专业平台。无论是从视觉设计还是功能性角度来看，都体现了现代网页设计的趋势和标准。

资源推荐

资源详情

资源评论

收起资源包目录

养生科技公司大气宽屏bootstrap模板_ html网站模板_网页源码移动端前端_H5模板_自适应响应式源码.rar （157个子文件）

bootstrap.css 146KB

cards.css 87KB

style.css 87KB

animate.css 70KB

icomoon.css 58KB

magnific-popup.css 8KB

owl.carousel.min.css 4KB

owl.theme.default.min.css 2KB

.DS_Store 8KB

.DS_Store 6KB

icomoon.eot 266KB

glyphicons-halflings-regular.eot 20KB

index.html 31KB

full_2.jpg 386KB

full_4.jpg 303KB

full_3.jpg 208KB

full_1.jpg 198KB

img_2.jpg 91KB

img_same_dimension_5.jpg 89KB

img_same_dimension_6.jpg 77KB

img_same_dimension_7.jpg 71KB

img_3.jpg 51KB

img_same_dimension_1.jpg 46KB

img_1.jpg 43KB

img_same_dimension_4.jpg 34KB

img_4.jpg 32KB

img_same_dimension_8.jpg 29KB

img_same_dimension_2.jpg 25KB

img_same_dimension_3.jpg 24KB

person_8.jpg 21KB

person_1.jpg 20KB

person_3.jpg 18KB

person_6.jpg 18KB

person_5.jpg 15KB

person_4.jpg 15KB

person_2.jpg 12KB

person_7.jpg 12KB

person_9.jpg 2KB

jquery.min.js 82KB

owl.carousel.min.js 39KB

bootstrap.min.js 36KB

jquery.magnific-popup.min.js 20KB

modernizr-2.6.2.min.js 15KB

jquery.stellar.min.js 12KB

jquery.waypoints.min.js 9KB

wow.min.js 8KB

jquery.easing.1.3.js 8KB

jquery.style.switcher.js 7KB

main.js 5KB

respond.min.js 4KB

jquery.countTo.js 4KB

bootstrap.css.map 83KB

cards.css.map 50KB

style.css.map 50KB

iphone_1.png 415KB

_variables.scss 30KB

_style.scss 22KB

_glyphicons.scss 20KB

_forms.scss 16KB

_navbar.scss 14KB

_card-navigations.scss 9KB

_theme.scss 8KB

_normalize.scss 7KB

_card-contents.scss 7KB

_vendor-prefixes.scss 6KB

_card-projects.scss 6KB

_panels.scss 6KB

_type.scss 6KB

_card-base.scss 6KB

_card-features.scss 6KB

_button-groups.scss 6KB

_card-footers.scss 6KB

_carousel.scss 5KB

_navs.scss 5KB

_dropdowns.scss 5KB

_tables.scss 5KB

_responsive-utilities.scss 4KB

_gradients.scss 4KB

_input-groups.scss 4KB

_buttons.scss 4KB

_card-pricing.scss 4KB

_modals.scss 4KB

_popovers.scss 3KB

_card-blogs.scss 3KB

_grid.scss 3KB

_list-group.scss 3KB

_card-team.scss 3KB

_scaffolding.scss 3KB

_tooltip.scss 3KB

_forms.scss 3KB

_card-mixin-variables.scss 2KB

cards.scss 2KB

_grid-framework.scss 2KB

style.scss 2KB

_card-testimonial.scss 2KB

_pagination.scss 2KB

共 157 条

<!DOCTYPE html>     <html class="no-js">  <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Voltage — 100% Free Fully Responsive HTML5 Template </title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content="Free HTML5 Template by FREEHTML5.CO" /> <meta name="keywords" content="free html5, free template, free bootstrap, html5, css3, mobile first, responsive" /> <meta name="author" content="FREEHTML5.CO" />  <meta property="og:title" content=""/> <meta property="og:image" content=""/> <meta property="og:url" content=""/> <meta property="og:site_name" content=""/> <meta property="og:description" content=""/> <meta name="twitter:title" content="" /> <meta name="twitter:image" content="" /> <meta name="twitter:url" content="" /> <meta name="twitter:card" content="" />  <link rel="shortcut icon" href="favicon.ico">  <link href='#css?family=Open+Sans:400,300,700|Monsterrat:400,700|Merriweather:400,300italic,700' rel='stylesheet' type='text/css'>  <link rel="stylesheet" href="css/animate.css">  <link rel="stylesheet" href="css/icomoon.css">  <link rel="stylesheet" href="css/magnific-popup.css">  <link rel="stylesheet" href="css/owl.carousel.min.css"> <link rel="stylesheet" href="css/owl.theme.default.min.css">  <link rel="stylesheet" href="css/bootstrap.css">  <link rel="stylesheet" href="css/cards.css">  <script src="js/modernizr-2.6.2.min.js"></script>   </head> <body> <div id="fh5co-page"> <nav class="fh5co-nav-style-1" role="navigation" data-offcanvass-position="fh5co-offcanvass-left"> <div class="container"> <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12 fh5co-logo"> <a href="#" class="js-fh5co-mobile-toggle fh5co-nav-toggle"><i></i></a> <a href="#">Voltage</a> </div> <div class="col-lg-6 col-md-5 col-sm-5 text-center fh5co-link-wrap"> <ul data-offcanvass="yes"> <li class="active"><a href="#">Tour</a></li> <li><a href="#">Explore</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Pricing</a></li> </ul> </div> <div class="col-lg-3 col-md-4 col-sm-4 text-right fh5co-link-wrap"> <ul class="fh5co-special" data-offcanvass="yes"> <li><a href="#">Login</a></li> <li><a href="#" class="call-to-action">Get Started</a></li> </ul> </div> </div> </nav> <div class="fh5co-cover fh5co-cover-style-2 js-full-height" data-stellar-background-ratio="0.5" data-next="yes" style="background-image: url(images/full_1.jpg);"> <span class="scroll-btn wow fadeInUp" data-wow-duration="1s" data-wow-delay="1.4s"> <a href="#"> <span class="mouse"><span></span></span> </a> </span> <div class="fh5co-overlay"></div> <div class="fh5co-cover-text"> <div class="container"> <div class="row"> <div class="col-md-push-6 col-md-6 full-height js-full-height"> <div class="fh5co-cover-intro"> <h1 class="cover-text-lead wow fadeInUp" data-wow-duration="1s" data-wow-delay=".5s">Create Amazing Things</h1> <h2 class="cover-text-sublead wow fadeInUp" data-wow-duration="1s" data-wow-delay=".8s">Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics.</h2> <p class="wow fadeInUp" data-wow-duration="1s" data-wow-delay="1.1s"><a href="#" class="btn btn-primary btn-outline btn-lg">See Our Work</a></p> </div> </div> </div> </div> </div> </div> <div class="fh5co-project-style-2"> <div class="container"> <div class="row p-b"> <div class="col-md-6 col-md-offset-3 text-center"> <h2 class="fh5co-heading wow fadeInUp" data-wow-duration="1s" data-wow-delay=".5s">Our Best Projects</h2> <p class="wow fadeInUp" data-wow-duration="1s" data-wow-delay=".8s">Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics.</p> <p class="wow fadeInUp" data-wow-duration="1s" data-wow-delay="1.1s"><a href="#" class="btn btn-success btn-lg">Start your project</a></p> </div> </div> </div> <div class="fh5co-projects"> <ul> <li class="wow fadeInUp" style="background-image: url(images/full_4.jpg);" data-wow-duration="1s" data-wow-delay="1.4s" data-stellar-background-ratio="0.5"> <a href="#"> <div class="fh5co-overlay"></div> <div class="container"> <div class="fh5co-text"> <div class="fh5co-text-inner"> <div class="row"> <div class="col-md-6"><h3>Project Name #1</h3></div> <div class="col-md-6"><p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</p></div> </div> </div> </div> </div> </a> </li> <li class="wow fadeInUp" style="background-image: url(images/full_2.jpg);" data-wow-duration="1s" data-wow-delay="1.7s" data-stellar-background-ratio="0.5"> <a href="#"> <div class="fh5co-overlay"></div> <div class="container"> <div class="fh5co-text"> <div class="fh5co-text-inner"> <div class="row"> <div class="col-md-6"><h3>Project Name #2</h3></div> <div class="col-md-6"><p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</p></div> </div> </div> </div> </div> </a> </li> <li class="wow fadeInUp" style="background-image: url(images/full_1.jpg);" data-wow-duration="1s" data-wow-delay="2s" data-stellar-background-ratio="0.5"> <a href="#"> <div class="fh5co-overlay"></div> <div class="container"> <div class="fh5co-text"> <div class="fh5co-text-inner"> <div class="row"> <div class="col-md-6"><h3>Project Name #3</h3></div> <div class="col-md-6"><p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</p></div> </div> </div> </div> </div> </a> </li> </ul> </div> </div> <div class="fh5co-blog-style-1"> <div class="container"> <div class="row p-b"> <div class="col-md-6 col-md-offset-3 text-center"> <h2 class="fh5co-heading wow fadeInUp" data-wow-duration="1s" data-wow-delay=".5s">Recent From Blog</h2> <p class="wow fadeInUp" data-wow-duration="1s" data-wow-delay=".8s">Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. </p> </div> </div> <div class="row p-b"> <div class="col-md-4 col-sm-6 col-xs-6 col-xxs-12"> <div class="fh5co-post wow fadeInLeft" data-wow-duration="1s" data-wow-delay="1.1s"> <div class="fh5co-post-image"> <div class="fh5co-overlay"></div> <div class="fh5co-category"><a href="#">

评论收藏

内容反馈