changeset 3775:a7ee5dd55b32

changed index.html, add css/main.css
author Fumichan <c116092@h.koeki-u.ac.jp>
date Fri, 21 Dec 2018 14:13:46 +0900
parents 99707de14012
children d63407918270
files css/main.css index.html
diffstat 2 files changed, 170 insertions(+), 71 deletions(-) [+]
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/css/main.css	Fri Dec 21 14:13:46 2018 +0900
@@ -0,0 +1,110 @@
+/* SKIP - Shonai Koeki Information Project - main style sheet */
+
+body{
+    margin:0;
+    padding:0;
+    background-color:#FFFFCC;
+}
+
+header{
+	padding-top: 50px;
+	text-align: center;
+	margin: 0 auto;
+}
+
+/*.nav-box{
+	background-color:#FFFFCC;
+  }*/
+
+nav{
+	position: relative;
+	border-bottom: 5px solid #777;
+	width: 100%;
+	top: 0;
+	z-index: 100;
+}
+
+nav ul{
+	position: absolute;
+	left:10%;
+	display: table;
+	margin: 0 auto;
+	padding: 0;
+	width: 80%;
+	text-align: center;
+}
+
+nav ul li{
+	display: table-cell;
+	width: 50px;
+}
+
+nav ul li a{
+	display: block;
+	width: 100%;
+	height: 100%;
+	padding: 10px 0;
+	text-decoration: none;
+	color: #777;
+}
+
+nav ul li.current{
+	font-weight: bold;
+	border-top: 5px solid #00B0F0;
+}
+
+nav ul li.current a{
+	color: #00B0F0;
+}
+
+nav ul li a:hover{
+	color: #0089BB;
+	background-color: #FBFBDD;
+}
+
+nav ul li:hover{
+	border-top: 5px solid #F8E750;
+} 
+
+.contents{
+	margin: 60px 10px 60px 10px;
+}
+
+h2 {
+     padding: .5em .75em;
+     background-color: #d3e6a8;
+     border-left: 8px solid #0a6641;
+}
+
+.explanation {
+	 background: #fff;
+	 border: 5px double #0a6641;
+	 margin: 20px 50px; padding: 10px 5px;
+}
+
+p.mimg {
+  float: left;
+  margin-right: 2px;
+  margin-bottom: 1px;
+}
+
+a.tlink{
+    text-align: right;
+    background-color: white;
+    color: black;
+}
+
+footer{
+	font-size: 80%;
+	width: 100%;
+    text-align: center;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    background-color: #313131;
+}
+
+footer p.copyright{
+	color: #fff;
+	/*letter-spacing: 5px;*/
+	/*font-style: normal;*/
+}
--- a/index.html	Fri Dec 21 14:08:59 2018 +0900
+++ b/index.html	Fri Dec 21 14:13:46 2018 +0900
@@ -1,80 +1,69 @@
 <!DOCTYPE html>
+<html lang="ja">
 <head>
-<title>skip home page</title>
-<style type="text/css">
-<!--
-
--->
-</style>
-<meta charset="utf-8">
-<link rel="stylesheet" type="text/css" href="main.css">
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
-
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="keywords" content="">
+        <meta name="description" content="">
+        <title>HOME | SKIP - Shonai Koeki Information Project -</title>
+        <!--[if lt IE 9]>
+        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+        <![endif]-->
+        <link rel="shortcut icon" href="favicon.ico">
+        <link rel="stylesheet" href="css/main.css">
+        <script type="text/javascript" src="js/jquery.js"></script>
+        <script type="text/javascript" src="js/script.js"></script>
 </head>
 
 <body>
-
-<div class="menu">
- <ul>
-  <li><a href=""></a></li>
-  <li><a href="shuzai/index.html">取材</a></li>
-  <li><a href="oasis/oasis.html">オアシスまつり</a></li>
-  <li><a href="">伝統芸能</a></li>
-  <li><a href=""></a></li>
- </ul>
-</div>
-<!-- menu end -->
+        <nav>
+                 <ul>
+                        <li class="current"><a href="./">ホーム</a></li>  <!-- Menu -->
+                        <li><a href="./shuzai/">取材関連</a></li>
+                        <li><a href="./oasis/oasis.html">オアシスまつり</a></li>
+                        <li><a href="./shuzai/trad/">伝統芸能</a></li> 
+                </ul>
+        </nav>
+    </div>
 
-<div class="top">
-<h1>
-<img class="kamo" src="kamonkun.png" alt="カモンくん">
-SKIP - Shonai Koeki Information Project -</h1>
-</div>
-<!-- top end-->
-
-<h2>SKIPとは</h2>
-<div class="skip">
-<p>SKIP = Shonai Koeki Information Project =</p>
-<p>
-このサイトでは、私たちSKIPが取材した山形県酒田市のお店や名所などを紹介しています。また、記事のなかでお店の歴史やこだわりなど様々な情報を発信しています。</p>
-</div>
-<!-- skip end  -->
+        <header>
+                <img src="skiplogo.png" alt="SKIP - Shonai Koeki Information Project -">
+        </header>
+        
 
-<h2 id="toshi">2018年</h2>
-<div class="kwsk">
-<ul>
-<li><a href ="https://skip.koeki-prj.org/shuzai/nico/nico.html">Nicoに行って来ました。</a></li>
-</ul>
-</div>
-<!-- 2018 end -->
-
-<h2 id="toshi">2017年</h2>
-<div class="kwsk">
-<ul>
-<li><a href ="https://skip.koeki-prj.org/shuzai/omatsu/omatsu.html">大松屋に行って来ました。</a></li>
-<li><a href ="https://skip.koeki-prj.org/shuzai/laluce/laluce.html">イタリアンレストラン「ラ・ルーチェ(la luce)」に行って来ました。</a></li>
-</ul>
-</div>
-<!-- 2017 end -->
+        
+        <div class="contents">
+                <section class="main">
+                        <h2>SKIPとは</h2>
+                        <section class="explanation">
+                                <p>SKIP = Shonai Koeki Information Project =</p>
+                                <p>このサイトでは、私たちSKIPが取材した山形県酒田市のお店や名所などを紹介しています。また、記事のなかでお店の歴史やこだわりなど様々な情報を発信しています。</p>
+                        </section>
+                        <h2>2018年</h2>
+                        <section class="explanation">
+                        <ul>
+                                <li><a href ="https://skip.koeki-prj.org/shuzai/nico/nico.html">Nicoに行って来ました。</a></li>
+                        </ul>
+                        </section>
+                        
+                        <h2>2017年</h2>
+                        <section class="explanation">
+                        <ul>
+                                <li><a href ="https://skip.koeki-prj.org/shuzai/omatsu/omatsu.html">大松屋に行って来ました。</a></li>
+                                <li><a href ="https://skip.koeki-prj.org/shuzai/laluce/laluce.html">イタリアンレストラン「ラ・ルーチェ(la luce)」に行って来ました。</a></li>
+                        </ul>
+                        </section>
 
-<h2>記事一覧</h2>
-<div class="list">
-<ul>
-  <li><a href="#2017">2017年</a>
-</ul>
-</div>
-<!-- ichiran end -->
-
-
-<div class="footer">
-  Copyright &copy; 東北公益文科大学学内サークル SKIP. All Rights Reserved.
-</div>
-<!-- footer end-->
-
-<div class="back">
-<h4><a href="#TOP" class="tlink">トップへ戻る</a></h4>
-</div>
-<!-- topback end -->
-
+                        <h2>記事一覧</h2>
+                        <section class="explanation">
+                        <ul>
+                                <li><a href="#2017">2017年</a>
+                        </ul>
+                        </section>
+                </section> <!-- /main -->
+        </div> <!-- /contents -->
+        <footer>
+                <p class="copyright">Copyright (C) 2018 SKIP - Shonai Koeki Information Project - . All Rights Reserved.</p>
+        </footer>
 </body>
-</html>
+</html>
\ No newline at end of file

yatex.org