简洁二列排版资讯响应式网页模板.7z资源-CSDN文库

共32个文件

jpg：10个

woff2：3个

svg：3个

HTML

web前端

网站源码

课程设计

JavaScript

需积分: 5 98 浏览量 2024-06-20 08:52:20 上传评论收藏 1.78MB 7Z 举报

资源推荐

资源详情

资源评论

收起资源包目录

简洁二列排版资讯响应式网页模板.7z （32个子文件）

简洁二列排版资讯响应式网页模板

html

page-2.html 11KB

jquery-3.3.1.min.js 85KB

webfonts

fa-brands-400.woff 85KB

fa-brands-400.ttf 131KB

fa-brands-400.svg 732KB

fa-solid-900.woff 100KB

fa-solid-900.eot 204KB

fa-solid-900.ttf 204KB

fa-brands-400.woff2 73KB

fa-regular-400.woff2 15KB

fa-brands-400.eot 131KB

fa-regular-400.eot 39KB

fa-regular-400.woff 18KB

fa-regular-400.svg 137KB

fa-regular-400.ttf 39KB

fa-solid-900.woff2 77KB

fa-solid-900.svg 775KB

img

forty_image_12.jpg 14KB

forty_image_32.jpg 214KB

forty_image_22.jpg 70KB

forty_image_01.jpg 60KB

forty_image_31.jpg 133KB

forty_image_14.jpg 46KB

forty_image_11.jpg 24KB

forty_image_02.jpg 32KB

forty_image_21.jpg 56KB

forty_image_13.jpg 30KB

css

bootstrap.min.css 150KB

templatemo-style.css 15KB

all.min.css 52KB

index.html 13KB

page-3.html 12KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" />  <link rel="stylesheet" href="css/all.min.css" /> <link rel="stylesheet" href="css/bootstrap.min.css" /> <link rel="stylesheet" href="css/templatemo-style.css" /> <title>Sided Bootstrap 4 Theme</title> </head>  <body> <div class="columns-bg">  <section id="logo" class="tm-section-logo"> <div class="container-fluid"> <div class="row"> <div class="col-sm-12 offset-sm-0 col-md-6 offset-md-6"> <div class="tm-site-name-container"> <div class="tm-site-name-container-inner"> <h1 class="text-uppercase tm-text-primary tm-site-name"> Sided </h1> <p class="tm-text-primary tm-site-description"> new theme just for you </p> </div> </div> </div> </div> </div> </section>  <section id="intro" class="tm-p-1-section-1"> <div class="container-fluid"> <div class="row"> <div class="col-md-6"> <div class="tm-section-text-container"> <i class="tm-text-white"> <p class="mb-0"> Nullam eget dignissim orci. Donec tincidunt blandit libero iaculis fermentum. Aliquam erat volutpat. Interger suscipit aliquam augue ac rutrum. Phasellus sit amet erat id sapien efficitur euismod.</p> </i> </div> </div> </div> </div> </section>  <section id="our_place"> <div class="container-fluid"> <div class="row"> <div class="col-md-12 col-lg-6 tm-section-image-container tm-img-left-container" > <img src="img/forty_image_01.jpg" alt="Image" class="img-fluid" /> </div> <div class="col-md-12 col-lg-6"> <div class="tm-section-text-container-2"> <h2 class="tm-text-primary tm-section-title-mb tm-sm-bg-white-alpha" > Our Place </h2> <div class="tm-text-gray"> <p class="mb-4"> Sided Bootstrap v4.2.1 template has 3 HTML pages. <a href="index.html">Index</a>, <a href="page-2.html">Page 2</a> and <a href="page-3.html">Page 3</a>. You may share this Sided template or <a rel="nofollow" href="https://www.facebook.com/templatemo">our templatemo page</a> to your friends. Pellentesque commodo malesuada est. </p> <p class="mb-0"> Suspendisse porttitor sollicitudin nisi et bibendum. Donec ac semper ante, non sagittis sapien. Duis hendrerit tellus sit amet cursus euismod. </p> </div> </div> </div> </div> </div> </section>  <section id="section_4" class="tm-section-4"> <div class="container-fluid"> <div class="row flex-column-reverse flex-lg-row"> <div class="col-md-12 col-lg-6 tm-text-left-container"> <div class="tm-section-text-container-3 tm-bg-white-alpha h-100"> <h2 class="tm-text-accent tm-section-title-mb"> Fusce a porttitor augue </h2> <p class="mb-0"> Quisque rutrum dapibus odio vitae tincidunt. Etiam sollicitudin augue non porta interdum. Pellentesque placerat orci at libero ornare, nec viverra justo lobortis. Phasellus venenatis eros non. </p> </div> </div> <div class="col-md-12 col-lg-6 tm-section-image-container tm-img-right-container" > <img src="img/forty_image_02.jpg" alt="Image" class="img-fluid tm-img-right" /> </div> </div> </div> </section>  <section id="gallery"> <div class="container-fluid"> <div class="row"> <div class="col-12 tm-section-title-mb tm-gallery-title-col"> <h2 class="tm-section-title-2">Beautiful Rollovers</h2> <hr class="tm-section-title-underline" /> </div> <div class="col-12"> <div class="grid"> <figure class="effect-duke mb-3"> <img src="img/forty_image_11.jpg" alt="Image" class="img-fluid" /> <figcaption> <h2>Messy <span>Duke</span></h2> <p>When he looks at the sky, he feels to run.</p> <a href="#">View more</a> </figcaption> </figure> <figure class="effect-duke"> <img src="img/forty_image_12.jpg" alt="Image" class="img-fluid" /> <figcaption> <h2>Messy <span>Duke</span></h2> <p>When he looks at the sky, he feels to run.</p> <a href="page-2.html">View more</a> </figcaption> </figure> <figure class="effect-duke mb-3"> <img src="img/forty_image_13.jpg" alt="Image" class="img-fluid" /> <figcaption> <h2>Messy <span>Duke</span></h2> <p>When he looks at the sky, he feels to run.</p> <a href="#">View more</a> </figcaption> </figure> <figure class="effect-duke"> <img src="img/forty_image_14.jpg" alt="Image" class="img-fluid" /> <figcaption> <h2>Messy <span>Duke</span></h2> <p>When he looks at the sky, he feels to run.</p> <a href="#">View more</a> </figcaption> </figure> </div> </div> <div class="col-md-6 tm-section-col-4"> <div class="tm-section-text-container-4"> <p class="tm-text-secondary mb-0"> Description text for beautiful rollovers using text color code #999 for this line. Quisque pharetra mauris in libero vaius tristique. </p> </div> </div> </div> </div> </section>  <section id="contact" class="tm-section-contact"> <div class="row tm-contact-section"> <div class="col-md-6 px-0"> <div class="tm-bg-white-alpha tm-contact-left"> <div class="media mb-5"> <a href="#" class="tm-contact-link"> <span class="tm-contact-icon-container">

评论收藏

内容反馈