深蓝色商务UI设计公司企业模板下载_网页源码移动端前端_H5模板

共76个文件

jpg：31个

png：20个

js：7个

6 浏览量 2023-08-05 11:24:02 上传评论收藏 3.89MB RAR 举报

该压缩包文件包含的是一款深蓝色商务UI设计的公司企业模板，专为网页源码、移动端前端和H5页面设计。这款模板具有自适应响应式的特点，能够在不同设备上提供一致且优秀的用户体验，无论是桌面电脑还是手机、平板，都能流畅展示。我们要了解“UI设计”（User Interface Design）是指用户界面的设计，它关注于如何使产品易于使用、吸引人并且有效。在这款模板中，深蓝色调被选择作为主色调，因为它通常传达专业性和信任感，非常适合商务环境。同时，设计风格大气且漂亮，能够提升企业的品牌形象。 “Bootstrap”是这个模板可能使用的框架，它是一个流行的开源前端开发框架，用于快速构建响应式和移动优先的网站。Bootstrap包含了CSS、JS组件和预定义的样式，可以简化网页布局和交互设计。 “CSS3”和“HTML5”是现代网页开发的核心技术。CSS3允许开发者实现更丰富的样式和动画效果，如阴影、渐变、圆角等，同时提供了媒体查询等功能，使得设计能够适应不同的屏幕尺寸。HTML5则增强了网页的语义性，引入了新的标签和API，提升了音频、视频处理和离线存储能力。 “自适应响应式源码”意味着模板能够根据用户的设备类型和屏幕尺寸自动调整布局。这通过CSS3的媒体查询实现，确保无论在大屏幕显示器还是小屏幕移动设备上，内容都能以最佳方式呈现。 “js”指的是JavaScript，这是一种广泛用于网页动态效果和交互的编程语言。在这个模板中，JavaScript可能被用来实现诸如滑动、弹出框、导航切换等动态功能，提高用户体验。此外，模板还强调了“律师”和“培训”服务，这表明它可能特别适合法律咨询或教育培训机构使用。这些特定行业的元素和功能可能会被集成到模板中，比如案例展示、预约表单或者课程介绍等。总结来说，这个压缩包提供了一套深蓝色的商务UI设计公司企业模板，基于Bootstrap、CSS3和HTML5技术，具有自适应响应式特性，适用于多平台展示。它适合需要专业形象展示和良好用户体验的企业，特别是法律和培训领域。通过使用这套模板，企业可以快速搭建一个既美观又功能齐全的在线平台。

资源推荐

资源详情

资源评论

收起资源包目录

深蓝色商务UI设计公司企业模板下载_深蓝色蓝色商务单页 bootstrap css3 html5 ui设计设计屏自适应图片律师服务培训_html网站模板_网页源码移动端前端_H5模板_自适应响应式源码.rar （76个子文件）

深蓝色商务UI设计公司企业模板下载_深蓝色蓝色商务单页 bootstrap css3 html5 ui设计设计公司企业商务大气漂亮精品宽屏自适应图片律师服务培训

spdn_7_smiley

b.jpg 23KB

bootstrap.js 96KB

bootstrap.min.js 43KB

jquery-2.0.2.js 237KB

custom-script.js 506B

isotope.min.js 40KB

isotope.function.js 2KB

jquery.stellar.js 23KB

css

style.css 30KB

bootstrap.min.css 86KB

responsive.css 517B

bootstrap.css 111KB

font-awesome.min.css 23KB

index.html 38KB

single.html 20KB

images

iphone-land.png 190KB

card-1.jpg 9KB

shopping-girl.jpg 148KB

content-2.jpg 3KB

2.jpg 25KB

queen-mary-university.png 5KB

story-1.png 8KB

breakfast.jpg 338KB

dot-overlay.png 3KB

overlay.png 3KB

6.jpg 32KB

post-3.jpg 82KB

1.jpg 26KB

a.jpg 41KB

poly.jpg 93KB

content-4.jpg 5KB

post-1.jpg 71KB

arrow-right.png 3KB

imac-2.png 180KB

content-3.jpg 15KB

story-2.png 10KB

5.jpg 19KB

google.png 4KB

team-3.jpg 29KB

imac-1.png 1.29MB

content-1.jpg 5KB

img-border.jpg 8KB

uea-university.png 4KB

plentific.png 3KB

8.jpg 14KB

story-3.png 11KB

topgear.png 4KB

bg-iphone.jpg 186KB

iphone-1.png 81KB

feature-box.jpg 193KB

arrow-left.png 2KB

team-1.jpg 34KB

app-store-black.png 4KB

team-2.jpg 31KB

3.jpg 25KB

7.jpg 25KB

mac-1.png 90KB

team-4.jpg 42KB

9.jpg 13KB

favicon.png 4KB

4.jpg 34KB

play-store-black.png 5KB

post-2.jpg 77KB

card-2.jpg 9KB

s.jpg 15KB

blog.html 23KB

fonts

FontAwesome.otf 84KB

glyphicons-halflings-regular.svg 106KB

glyphicons-halflings-regular.ttf 44KB

glyphicons-halflings-regular.woff 23KB

glyphicons-halflings-regular.eot 20KB

fontawesome-webfont.eot 55KB

glyphicons-halflings-regular.woff2 18KB

fontawesome-webfont.woff 64KB

fontawesome-webfont.svg 280KB

fontawesome-webfont.ttf 110KB

<!DOCTYPE html> <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"> <title>Smiley</title>  <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="css/font-awesome.min.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <link href="css/responsive.css" rel="stylesheet">  </head> <body> <div class="wrapper">  <section id="home" class="navigations">  <div class="search-bar collapse p-y-0" id="search"> <div class="container"> <div class="input-group text-center"> <input type="text" class="form-control search-text p-x-0" placeholder="Search Your Stuffs..." /> <span class="input-group-btn"><button class="btn btn-primary btn-md p-x-0 search-btn" type="button"><i class="fa fa-arrow-right"></i></button> </span> </div> </div> </div>   <div class="top-menu collapse in" id="top-menu"> <div class="container"> <div class="row"> <div class="col-md-6"> <div class="pull-left"> <u class="user-menu menu-left"> <li><a href="#"><i class="fa fa-user hidden-md-up"></i><span class="hidden-sm-down"> My Account</span></a></li> <li><a href="#"><i class="fa fa-users hidden-md-up"></i><span class="hidden-sm-down"> Create Account</span></a></li> <li><a href="#"><i class="fa fa-lock hidden-md-up"></i><span class="hidden-sm-down"> Log In </span></a></li> </u> </div> </div> <div class="col-md-6"> <div class="pull-right"> <u class="user-menu menu-right"> <li><a href="#"><i class="fa fa-phone hidden-md-up"></i><span class="hidden-sm-down"> +(5920) 6324 9345</span></a></li> <li><a href="#"><i class="fa fa-headphones hidden-md-up"></i><span class="hidden-sm-down"> Help </span></a></li> <li class="nav-item"><a class="nav-link" href="#" data-toggle="collapse" data-target="#search"><i class="fa fa-search hidden-md-up"></i><span class="hidden-sm-down"> Search </span></a></li> </u> </div> </div> </div> </div> </div>   <div class="bottom-menu"> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12"> <nav class="navbar bg-faded bottom-nav p-x-0"> <button class="navbar-toggler pull-right top-toggle-btn" title="Top Menu" type="button" data-toggle="collapse" data-target="#top-menu"></button> <a class="navbar-brand" href="#"><i class="fa fa-cubes"></i><span class="hidden-xs-down"> Smiley</span></a> <button class="navbar-toggler hidden-md-up bottom-toggle-btn center-block" title="Bottom Menu" type="button" data-toggle="collapse" data-target="#bottom-menu">☰</button> <div class="collapse navbar-toggleable-sm" id="bottom-menu"> <ul class="nav navbar-nav"> <li class="nav-item active"><a href="#home" class="nav-link scrollto">Home <span class="sr-only">(current)</span></a></li> <li class="nav-item"><a class="nav-link scrollto" href="#features">Features</a></li> <li class="nav-item"><a class="nav-link scrollto" href="#work">Work</a></li> <li class="nav-item"><a class="nav-link" href="#team" >Team</a></li> <li class="nav-item"><a class="nav-link" href="blog.html" >Blog</a></li> </ul> </div> </nav>  </div> </div> </div> </div>  </section>  <section class="home" data-stellar-background-ratio="0.1"> <div class="intro"> <div class="container"> <div class="row"> <div class="col-md-4 col-md-offset-1 col-sm-6 col-xs-12"> <div class="intro-iphone hidden-xs-down"> <img class="img-responsive center-block" src="images/iphone-1.png" alt="" /> </div> </div> <div class="col-md-5 col-sm-6 col-xs-12"> <div class="intro-content"> <div class="intro-item"> <div class="intro-logo"> S </div> <h1>Get Smily</h1> <h2 class="hidden-md-down">Manage You Day Life</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore rerum ratione quisquam, nisi nulla hic omnis eveniet</p> <div class="app-wrap"> <a class="app-btn play-store" href="#"><i class="fa fa-play"></i> Play Store</a> <a class="app-btn app-sotre" href="#"><i class="fa fa-apple"></i> Apps Store</a> </div> </div> </div> </div> </div> </div> </div> </section> <div class="copyrights">Collect from <a href="http://www.moobnn.com/" title="模板在线">模板在线</a> <a href="http://guantaow.taobao.com" target="_blank">厚朴网络淘宝店</a></div>  <section class="color-area"> <div class="row"> <div class="col-md-4 col-sm-12 col-xs-12 p-r-0"> <div class="card card-inverse color-box-1"> <div class="color-box"> <div class="card-block"> <h3 class="card-title">For Ecommerce Website</h3> <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore rerum ratione quisquam, nisi nulla hic omnis eveniet expedita, debitis, porro deserunt est illo eaque, ipsum qui. Explicabo perspiciatis, labore voluptatibus</p> <a href="#" class="btn btn-primary color-box-btn btn-rectangle-out">Ecommerce</a> </div> </div> </div> </div> <div class="col-md-4 col-sm-12 col-xs-12 p-x-0"> <div class="card card-inverse color-box-2"> <div class="color-box"> <div class="card-block"> <h3 class="card-title">With Bootstrap v4 Alpha</h3> <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore rerum ratione quisquam, nisi nulla hic omnis eveniet expedita, debitis, porro deserunt est illo eaque, ipsum qui. Explicabo perspiciatis, labore voluptatibus</p> <a href="#" class="btn btn-primary color-box-btn btn-rectangle-out">Bootstrap</a> </div> </div> </div> </div> <div class="col-md-4 col-sm-12 col-xs-12 p-l-0"> <div class="card card-inverse color-box-3"> <div class="color-box"> <div class="card-block"> <h3 class="card-title">Fully Responsive Theme</h3> <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore rerum ratione quisquam, nisi nulla hic omnis eveniet expedita, debitis, porro deserunt est illo eaque, ipsum qui. Explicabo perspiciatis, labore voluptatibus</p> <a href="#" class="btn btn-primary color-box-btn btn-rectangle-out">Responsive</a> </div> </div> </div> </div> </div> </section>  <section id="features" class="feature"> <div class="container"> <div class="row"> <div class="col-md-12 col-sm-12 col-xs-12"> <div class="text-center"> <h2 class="feature-title">Let's see the latest Features</h2> <img class="max-para" src="images/img-border.jpg" /> <p class="max-para">Get the latest feature of the year, Tidak seperti anggapan banyak orang, Lorem Ipsum bukanlah teks-teks yang diacak. Ia berakar dari sebuah naskah sastra latin klasik dari era 45 sebelu

评论收藏

内容反馈