(Replaced content with "{{Kyoto}}") |
|||
Line 1: | Line 1: | ||
{{Kyoto}} | {{Kyoto}} | ||
+ | <!DOCTYPE html> | ||
+ | <html lang="ja"> | ||
+ | <head> | ||
+ | <meta charset="utf-8"> | ||
+ | <title>フリーHTML5/CSS3ホームページテンプレート NO.006</title> | ||
+ | <meta name="viewport" content="width=device-width"> | ||
+ | <meta name="keywords" content=""> | ||
+ | <meta name="description" content=""> | ||
+ | <link rel="stylesheet" type="text/css" href="css/style.css"> | ||
+ | <script src="js/jquery.js"></script> | ||
+ | <script src="js/script.js"></script> | ||
+ | <script src="js/jquery.smoothscroll.js"></script> | ||
+ | <script src="js/jquery.scrollshow.js"></script> | ||
+ | <script src="js/jquery.slideshow.js"></script> | ||
+ | <script> | ||
+ | $(function($){ | ||
+ | $('html').smoothscroll({easing : 'swing', speed : 1000, margintop : 50, headerfix : $('header'), outersmooth : true}); | ||
+ | $('.totop').scrollshow({position : 500}); | ||
+ | $('.slide').slideshow({ | ||
+ | touch : false, | ||
+ | bgImage : false, | ||
+ | autoSlide : true, | ||
+ | effect : 'fade', | ||
+ | repeat : true, | ||
+ | easing : 'swing', | ||
+ | interval : 5000, | ||
+ | duration : 1000, | ||
+ | imgHoverStop : false, | ||
+ | navHoverStop : false, | ||
+ | navImg : false, | ||
+ | navImgCustom : false, | ||
+ | navImgSuffix : '' | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | <!--[if lt IE 9]> | ||
+ | <script src="js/html5shiv.js"></script> | ||
+ | <script src="js/css3-mediaqueries.js"></script> | ||
+ | <![endif]--> | ||
+ | </head> | ||
+ | <body> | ||
+ | <header> | ||
+ | <div class="inner"> | ||
+ | <h1><a href="index.html"><img src="images/logo.png" alt="SAMPLE SITE"></a></h1> | ||
+ | <div class="spMenuWrap"> | ||
+ | <div id="spMenu"><span id="navBtn"><span id="navBtnIcon"></span></span></div> | ||
+ | </div> | ||
+ | <nav class="gnav"> | ||
+ | <ul> | ||
+ | <li><a href="index.html">ホーム</a></li> | ||
+ | <li class="subnav"><a href="index.html">会社情報</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">会社概要</a></li> | ||
+ | <li><a href="index.html">企業理念</a></li> | ||
+ | <li><a href="index.html">CSR活動</a></li> | ||
+ | <li><a href="index.html">IR情報</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="subnav"><a href="index.html">商品情報</a> | ||
+ | <ul> | ||
+ | <li class="subnav"><a href="index.html">商品A</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">商品A-1</a></li> | ||
+ | <li><a href="index.html">商品A-2</a></li> | ||
+ | <li><a href="index.html">商品A-3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="subnav"><a href="index.html">商品B</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">商品B-1</a></li> | ||
+ | <li><a href="index.html">商品B-2</a></li> | ||
+ | <li><a href="index.html">商品B-3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="subnav"><a href="index.html">商品C</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">商品C-1</a></li> | ||
+ | <li><a href="index.html">商品C-2</a></li> | ||
+ | <li><a href="index.html">商品C-3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="index.html">採用情報</a></li> | ||
+ | <li><a href="index.html">お問い合わせ</a></li> | ||
+ | <li class="subnav"><a href="sample.html">サンプル</a> | ||
+ | <ul> | ||
+ | <li><a href="sample.html#sample">ページ外リンク</a></li> | ||
+ | <li class="subnav"><a href="sample.html">サブメニュー</a> | ||
+ | <ul> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </nav> | ||
+ | </div><!-- /.inner --> | ||
+ | </header> | ||
+ | |||
+ | <div class="slide"> | ||
+ | <ul class="slideInner"> | ||
+ | <li><img src="images/slide01.jpg" alt=""></li> | ||
+ | <li><img src="images/slide02.jpg" alt=""></li> | ||
+ | <li><img src="images/slide03.jpg" alt=""></li> | ||
+ | </ul> | ||
+ | </div><!-- /.slide --> | ||
+ | |||
+ | <div id="contents"> | ||
+ | <h2>PRODUCTS<br><span>商品情報</span></h2> | ||
+ | <div class="threeCol"> | ||
+ | <div class="inner"> | ||
+ | <div class="image zoom"><a href="sample.html"><img src="images/dummy.jpg" alt=""></a></div> | ||
+ | <h4>商品A</h4> | ||
+ | <p>商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。</p> | ||
+ | <div class="btn"><a href="sample.html">詳しく見る</a></div> | ||
+ | </div><!-- /.inner --> | ||
+ | <div class="inner"> | ||
+ | <div class="image zoom"><a href="sample.html"><img src="images/dummy.jpg" alt=""></a></div> | ||
+ | <h4>商品B</h4> | ||
+ | <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> | ||
+ | <div class="btn"><a href="sample.html">詳しく見る</a></div> | ||
+ | </div><!-- /.inner --> | ||
+ | <div class="inner"> | ||
+ | <div class="image zoom"><a href="sample.html"><img src="images/dummy.jpg" alt=""></a></div> | ||
+ | <h4>商品C</h4> | ||
+ | <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> | ||
+ | <div class="btn"><a href="sample.html">詳しく見る</a></div> | ||
+ | </div><!-- /.inner --> | ||
+ | </div><!-- /.threeCol --> | ||
+ | |||
+ | <h2>INFORMATION<br><span>お知らせ</span></h2> | ||
+ | <dl class="information"> | ||
+ | <dt>20XX-01-01</dt> | ||
+ | <dd> | ||
+ | 更新情報などを掲載するのに便利なデザインです。dlタグに『class="information"』を追加してください。 | ||
+ | </dd> | ||
+ | <dt>20XX-01-01</dt> | ||
+ | <dd> | ||
+ | 更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。 | ||
+ | </dd> | ||
+ | <dt>20XX-01-01</dt> | ||
+ | <dd> | ||
+ | 更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。 | ||
+ | </dd> | ||
+ | </dl> | ||
+ | |||
+ | <h2>RECRUIT<br><span>採用情報</span></h2> | ||
+ | <div class="threeCol"> | ||
+ | <div class="inner"> | ||
+ | <a href="sample.html"> | ||
+ | <div class="image zoom overlay"><img src="images/dummy.jpg" alt=""></div> | ||
+ | <div class="text">新卒採用</div> | ||
+ | </a> | ||
+ | </div><!-- /.inner --> | ||
+ | <div class="inner"> | ||
+ | <a href="sample.html"> | ||
+ | <div class="image zoom overlay"><img src="images/dummy.jpg" alt=""></div> | ||
+ | <div class="text">キャリア採用</div> | ||
+ | </a> | ||
+ | </div><!-- /.inner --> | ||
+ | <div class="inner"> | ||
+ | <a href="sample.html"> | ||
+ | <div class="image zoom overlay"><img src="images/dummy.jpg" alt=""></div> | ||
+ | <div class="text">グローバル採用</div> | ||
+ | </a> | ||
+ | </div><!-- /.inner --> | ||
+ | </div><!-- /.threeCol --> | ||
+ | </div><!-- /.contents --> | ||
+ | |||
+ | <footer> | ||
+ | <div class="inner"> | ||
+ | <nav class="fnav"> | ||
+ | <ul> | ||
+ | <li><a href="index.html">ホーム</a></li> | ||
+ | <li class="subnav"><a href="index.html">会社情報</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">会社概要</a></li> | ||
+ | <li><a href="index.html">企業理念</a></li> | ||
+ | <li><a href="index.html">CSR活動</a></li> | ||
+ | <li><a href="index.html">IR情報</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | <ul> | ||
+ | <li class="subnav"><a href="index.html">商品情報</a> | ||
+ | <ul> | ||
+ | <li class="subnav"><a href="index.html">商品A</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">商品A-1</a></li> | ||
+ | <li><a href="index.html">商品A-2</a></li> | ||
+ | <li><a href="index.html">商品A-3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="subnav"><a href="index.html">商品B</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">商品B-1</a></li> | ||
+ | <li><a href="index.html">商品B-2</a></li> | ||
+ | <li><a href="index.html">商品B-3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="subnav"><a href="index.html">商品C</a> | ||
+ | <ul> | ||
+ | <li><a href="index.html">商品C-1</a></li> | ||
+ | <li><a href="index.html">商品C-2</a></li> | ||
+ | <li><a href="index.html">商品C-3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | <ul> | ||
+ | <li><a href="index.html">採用情報</a></li> | ||
+ | <li><a href="index.html">お問い合わせ</a></li> | ||
+ | <li class="subnav"><a href="sample.html">サンプル</a> | ||
+ | <ul> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | <li class="subnav"><a href="sample.html">サブメニュー</a> | ||
+ | <ul> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | <li><a href="sample.html">サブメニュー</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </nav> | ||
+ | </div><!-- /.inner --> | ||
+ | <div class="copyright"><small>Copyright © 20XX - 20XX SITENAME All Rights Reserved.</small></div><!-- /.copyright --> | ||
+ | </footer> | ||
+ | <div class="totop"><a href="#"><img src="images/totop.png" alt="ページのトップへ戻る"></a></div><!-- /.totop --> | ||
+ | </body> | ||
+ | </html> |
Revision as of 13:43, 8 October 2018
<!DOCTYPE html>
PRODUCTS
商品情報
商品A
商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。商品Aの内容。
商品C
テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
INFORMATION
お知らせ
- 20XX-01-01
- 更新情報などを掲載するのに便利なデザインです。dlタグに『class="information"』を追加してください。
- 20XX-01-01
- 更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。
- 20XX-01-01
- 更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。更新情報などを掲載するのに便利なデザインです。