Template:Biomod/2014/Hokudai: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
No edit summary
Line 3: Line 3:


<style type="text/css">
<style type="text/css">
body{
/*
background-color:#000000;/*背景の色*/
Theme Name: templateya.com
color:#cccccc;/*通常のテキストカラー*/
Theme URI: http://www.templateya.com
}
Description: 無料ホームページテンプレート
a{
*/
color:#0099FF;/*通常のリンクテキストカラー*/
}
a:hover{
color:#FF9900;/*マウスが乗った時の通常のリンクテキストカラー*/
text-decoration:underline;/*マウスが乗った時下線を表示（つけない場合は underline を none へ）*/
}


/*■初期設定ここまで*/
@charset "utf-8";
 
 
 
*{ margin:0; padding:0;}
img{border:0;}
 
table,div{
margin:auto;
}
 
/*■フォントサイズ調整*/
body {
body {
    font-size: 12px; /* モダンブラウザ */
background-image: url(../img/bg.jpg);
    *font-size: 80%; /* IE 7 */
background-repeat: repeat-x;
    *font: 80%; /* IE 6以下 */
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
}
 
header, article, footer, article, aside, time ,nav {  
body{
text-align:center;
}
 
/*■レイアウトセレクタ*/
.CNT{
text-align:center;
}
.L{
text-align:left;
}
.R{
text-align:right;
}
 
 
/*■基本レイアウト*/
#bg{
width:820px;
background:url(img/bg_con.jpg) repeat-y;
text-align:center;
}
#container{
width:800px;
margin:auto;
text-align:left;
}
#head{}
#head h1{
height:20px;
line-height:16px;
font-size:11px;
color:#CCCCCC;
font-weight:normal;
text-indent:10px;
}
#head h2{
padding:4px 0 0 10px;
font-weight:normal;
font-family:'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}
#head h2 a{
font-size:24px;
line-height:140%;
vertical-align:top;
text-decoration:none;
color:#CCCCCC;
font-weight:normal;
filter: glow(color=#666666,strength=100);
}
#head h2 a:hover{
font-size:24px;
line-height:140%;
vertical-align:top;
text-decoration:none;
color:#CCCCCC;
}
 
#head_menu{
height:42px;
zoom:100%;
}
#head_menu:after{
    content: "";
    clear: both;
    height: 0;
     display: block;
     display: block;
    visibility: hidden;
}  
}
img {
#head_menu ul *{
border:none;
list-style-type:none;
}
display:block;}
#container {
#head_menu ul li{
width: 960px;
width:160px;
margin-top: 0px;
height:42px;
margin-right: auto;
position:relative;
margin-bottom: 0px;
float:left;
margin-left: auto;
}
}
#head_menu ul li a{
header h1 {
width:160px;
display: block;
height:42px;
height: 100px;
text-align:center;
width: 250px;
color:#FFFFFF;
float: right;
line-height:42px;
margin-bottom: 0px;
text-decoration:none;
margin-top: 10px;
}
}
#head_menu ul li a:hover{
nav {
color:#FFFFFF;
float: left;
text-decoration:none;
}
}
header nav ul {
#head_menu ul li.off{
margin-top: 50px;
overflow:hidden;
margin-bottom: 30px;
width:160px;
}
}
header nav ul li{
#head_menu ul li.off ol.sub{
float: left;
left:0px; top:-999px;
list-style-type: none;
}
margin-right: 10px;
#head_menu ul ol.sub{
font-size: 12px;
position:absolute;
height: 30px;
left:0px; top:42px;
width: 90px;
width:160px;
display: block;
border:1px solid #999999;
text-align: center;
text-align:center;
line-height: 30px;
}
}
#head_menu ul li.on{
.nav_a {
width:160px;
color: #FFF;
}
background-color: #00F;
#head_menu ul>li.on{
}
overflow:visible;/*×*/
header nav ul .nav_a a {
}
color: #FFF;
#head_menu ul ol.sub li{
text-decoration: none;
width:160px;
}
height:30px;
header nav ul li a {
line-height:30px;
color: #CCC;
border-bottom:1px solid #999999;
text-decoration: none;
text-align:center;
height: 30px;
float:none;
width: 90px;
filter:alpha(opacity=85); /*IE*/
display: block;
-moz-opacity:0.85; /*FF*/
}
}
header nav ul li a:hover {
#head_menu ul ol.sub li a{
color: #FFF;
background:none;
background-color: #353331;
background-color:#FFFFFF;
height: 30px;
text-decoration:none;
width: 90px;
color:#000000;
display: block;
vertical-align:middle;
}
font-size:12px;
section article {
height:30px;
}
line-height:30px;
section article h1 {
text-align:center;
font-size: 12px;
}
border-bottom-width: 1px;
#head_menu ul ol.sub li a:hover{
border-bottom-style: solid;
color:#000000;
border-bottom-color: #999;
background:none;
color: #03F;
background-color:#FFCC00;
letter-spacing: 0.5em;
}
text-align: center;
 
padding-bottom: 10px;
#head_menu ul li.a01 a{ background:url(img/menu/a01.jpg) no-repeat;}
text-shadow:1px 1px 1px rgba(0,0,0,0.1);
#head_menu ul li.a01 a:hover{ background:url(img/menu/a01_on.jpg) no-repeat;}
}
#head_menu ul li.a02 a{ background:url(img/menu/a02.jpg) no-repeat;}
.ss {
#head_menu ul li.a02 a:hover{ background:url(img/menu/a02_on.jpg) no-repeat;}
float: left;
#head_menu ul li.a03 a{ background:url(img/menu/a03.jpg) no-repeat;}
height: 370px;
#head_menu ul li.a03 a:hover{ background:url(img/menu/a03_on.jpg) no-repeat;}
width: 260px;
#head_menu ul li.a04 a{ background:url(img/menu/a04.jpg) no-repeat;}
margin-top: 40px;
#head_menu ul li.a04 a:hover{ background:url(img/menu/a04_on.jpg) no-repeat;}
padding-right: 20px;
#head_menu ul li.a05 a{ background:url(img/menu/a05.jpg) no-repeat;}
padding-left: 20px;
#head_menu ul li.a05 a:hover{ background:url(img/menu/a05_on.jpg) no-repeat;}
background-color: #F7F7F7;
 
border: 1px solid #CCC;
 
 
/* Webkit */
/*メインイメージ*/
-webkit-border-top-left-radius:20px;
#main_image{
-webkit-border-top-right-radius:20px;
clear:left;
-webkit-border-bottom-right-radius:20px;
width:800px;
-webkit-border-bottom-left-radius:20px;
padding:0 0 1px 0;
border:solid #333333;
/* FF */
border-width:0 0 1px 0 ;
-moz-border-radius-topleft: 20px;
}
-moz-border-radius-topright: 20px;
#main_image div#main_img_txt h3{
-moz-border-radius-bottomright: 20px;
}
-moz-border-radius-bottomleft: 20px;
 
#contents{
/* IE9 */
margin:20px 10px 20px 10px;
border-top-left-radius: 20px;
clear:left;
    border-top-right-radius: 20px;
zoom:100%;
    border-bottom-right-radius: 20px;
}
    border-bottom-left-radius: 20px;
#contents:after{
content: "";
/* IE8 */
    clear: both;
    border-radius: 20px;
    height: 0;
behavior: url(js/ie-css3.htc);
    display: block;
}
    visibility: hidden;
.sl {
}
float: left;
#foot_up{
margin-left: 20px;
background:url(img/line_02.gif) no-repeat bottom;
height: 370px;
clear:both;
width: 330px;
height:32px;
margin-top: 40px;
margin:0 0 0 0;
padding-right: 20px;
}
padding-left: 20px;
#foot{
border: 1px solid #CCC;
clear:left;
background-color: #F7F7F7;
background:url(img/bg_foot.gif) no-repeat;
width:820px;
/* Webkit */
height:50px;
-webkit-border-top-left-radius:20px;
}
-webkit-border-top-right-radius:20px;
#copy{
-webkit-border-bottom-right-radius:20px;
line-height:40px;
-webkit-border-bottom-left-radius:20px;
font-size:11px;
text-align:center;
/* FF */
color:#FFFFFF;
-moz-border-radius-topleft: 20px;
padding:2px;
-moz-border-radius-topright: 20px;
}
-moz-border-radius-bottomright: 20px;
#copy a{
-moz-border-radius-bottomleft: 20px;
color:#ffffff;
text-decoration:none;
/* IE9 */
}
border-top-left-radius: 20px;
#copy a:hover{
    border-top-right-radius: 20px;
color:#ffffff;
    border-bottom-right-radius: 20px;
}
    border-bottom-left-radius: 20px;
 
/***トップ***/
/* IE8 */
#top{}
    border-radius: 20px;
#top div#top_up{
behavior: url(js/ie-css3.htc);
zoom:100%;
}
margin:0 0 20px 0;
section h2 {
}
font-size: 14px;
#top div#top_up:after{
letter-spacing: 0.3em;
content: "";
margin-left: 10px;
    clear: both;
text-shadow:1px 1px 1px rgba(0,0,0,0.1);
    height: 0;
}
    display: block;
section h3 {
    visibility: hidden;
font-weight: normal;
}
color: #03F;
#top div#top_up div#left{
font-size: 12px;
float:left;
letter-spacing: 0.3em;
width:400px;
border-bottom-width: 1px;
margin:0 0 0 0;
border-bottom-style: dotted;
}
border-bottom-color: #03F;
#top div#top_up div#left p{
padding-bottom: 5px;
margin:8px 0 0 0;
margin-bottom: 0px;
line-height:160%;
text-align: right;
}
text-shadow:1px 1px 1px rgba(0,0,0,0.1);
#top div#top_up div#right{
}
float:left;
section h3 a {
width:360px;
color: #00C;
margin:0 0 0 20px;
text-decoration: none;
}
}
#top div#top_up div#right h3{
section p {
font-size:12px;
font-size: 12px;
}
letter-spacing: 0.1em;
#top div#top_up div#right div#info{
line-height: 25px;
background:url(img/top/bg_info.gif) no-repeat;
margin-top: 0px;
width:360px;
margin-bottom: 0px;
height:200px;
}
padding:1px 1px 0px 1px;
section aside {
}
float: right;
#top div#top_up div#right div#info div#main{
height: 350px;
overflow:auto;
width: 230px;
width:358px;
margin-top: 40px;
height:198px;
border: 1px solid #CCC;
margin:0;
background-color: #F7F7F7;
}
margin-bottom: 40px;
#top div#top_up div#right div#info div#main h4{
padding-top: 20px;
margin:8px 10px 0 10px;
padding-right: 10px;
font-size:100%;
padding-left: 10px;
color:#FF9900;
}
/* Webkit */
#top div#top_up div#right div#info div#main p{
-webkit-border-top-left-radius:20px;
margin:4px 10px 0 10px;
-webkit-border-top-right-radius:20px;
}
-webkit-border-bottom-right-radius:20px;
#top div#btm{
-webkit-border-bottom-left-radius:20px;
clear:left;
}
/* FF */
#top div#btm div#bnr_sps{
-moz-border-radius-topleft: 20px;
}
-moz-border-radius-topright: 20px;
#top div#btm div#bnr_sps ul{
-moz-border-radius-bottomright: 20px;
list-style-type:none;
-moz-border-radius-bottomleft: 20px;
zoom:100%;
}
/* IE9 */
#top div#btm div#bnr_sps ul:after{
border-top-left-radius: 20px;
content: "";
     border-top-right-radius: 20px;
     clear: both;
     border-bottom-right-radius: 20px;
     height: 0;
     border-bottom-left-radius: 20px;
     display: block;
    visibility: hidden;
/* IE8 */
}
box-shadow: 0px;
#top div#btm div#bnr_sps ul li{
    border-radius: 20px;
float:left;
behavior: url(js/ie-css3.htc);
margin:0 8px 0 0;
}
}
section aside img {
#top div#btm div#bnr_sps ul li a:hover img{
margin-top: 10px;
filter:alpha(opacity=85); /*IE*/
}
-moz-opacity:0.85; /*FF*/
footer {
}
background-image: url(../img/footer_bg.jpg);
 
background-repeat: repeat-x;
/***その他のページ***/
margin-right: auto;
#other_page{}
margin-left: auto;
#other_page h3{
margin-bottom: 0px;
background:url(img/bg_h3.jpg) no-repeat;
height: 230px;
font-size:18px;
width: auto;
line-height:52px;
clear: right;
height:52px;
}
color:#FFFFFF;
#foot {
vertical-align:bottom;
height: 230px;
text-indent:10px;
width: 940px;
}
margin-right: auto;
 
margin-left: auto;
 
margin-bottom: 0px;
#other_page h4{ font-size:110%;
}
line-height:1.0em;
#follow {
vertical-align:top;
height: 160px;
margin:20px 0 0 0;
width: 270px;
color:#cccccc;
float: left;
border:solid #FFCC00;
margin-top: 20px;
text-indent:2px;
}
border-width:0 0 0 3px;
#foot #follow h2 {
}
font-size: 16px;
#other_page h5{
color: #FFF;
font-size:100%;
padding-left: 20px;
line-height:1.0em;
margin-bottom: 10px;
vertical-align:top;
text-shadow:0px 0px 5px #FFF;
margin:14px 0 0 0;
color:#FF9900;
/* IE8 */
}
behavior: url(js/ie-css3.htc);
#other_page div.typeA{
}
}
#foot #follow p {
#other_page div.typeA p{
font-size: 12px;
margin:2px 0 16px 0;
line-height: 25px;
line-height:200%;
margin-top: 0px;
}
color: #FFF;
#other_page div.typeB{
}
zoom:100%;
#foot #follow img {
}
padding-right: 10px;
#other_page div.typeB:after{
}
content: "";
#foot nav {
    clear: both;
height: 160px;
    height: 0;
width: 190px;
    display: block;
margin-top: 20px;
    visibility: hidden;
margin-left: 40px;
}
}
#other_page div.typeB p{
#foot nav h2 {
margin:2px 0 16px 0;
font-size: 14px;
line-height:200%;
color: #FFF;
}
text-align: center;
#other_page div.typeB div.left{
margin-bottom: 0px;
float:left;
text-shadow:0px 0px 5px #FFF;
width:370px;
}
/* IE8 */
#other_page div.typeB div.right{
behavior: url(js/ie-css3.htc);
float:right;
}
width:370px;
.footer_sub {
margin:0 0 0 20px;
padding-top: 37px;
}
}
 
#foot nav ul {
#other_page p.margin_none{ margin:0;}
margin-bottom: 0px;
#other_page p{ margin:6px 0 0 0;}
margin-top: 10px;
 
}
/*テーブルセット*/
#foot nav ul li {
#tbl_setA{
list-style-type: none;
border:#666666 solid 1px;
font-size: 12px;
border-collapse:collapse;
line-height: 25px;
margin:0;
background-image: url(../img/icon/footer_list.png);
}
background-repeat: no-repeat;
#tbl_setA th{
background-position: 0px;
border:#666666 solid 1px;
padding-left: 15px;
background:url(img/bg_th_a.gif);
color: #FFF;
padding:6px;
}
color:#CCCCCC;
#foot nav ul li a {
text-align:center;
color: #FFF;
}
text-decoration: none;
#tbl_setA td{
}
border:#666666 solid 1px;
#foot nav ul li a:hover {
padding:6px;
color: #333;
color:#CCCCCC;
}
#pr {
height: 50px;
width: 200px;
float: left;
margin-top: 120px;
font-size: 10px;
text-align: right;
color: #333;
}
#foot #pr p {
margin-top: 0px;
margin-bottom: 0px;
}
#foot #pr p a {
color: #333;
text-decoration: none;
}
#copy {
height: 35px;
width: 940px;
float: left;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #39F;
}
}
 
#foot #copy h3 {
 
font-size: 12px;
@media print{
margin-top: 0px;
 
margin-bottom: 0px;
#container{
line-height: 40px;
width:820px;
color: #333;
}
font-weight: normal;
text-align: center;
}
}
</style>
</style>
</head>
</head>

Revision as of 01:02, 16 September 2014

<html lang="ja"> <head>

<style type="text/css"> /* Theme Name: templateya.com Theme URI: http://www.templateya.com Description: 無料ホームページテンプレート

  • /

@charset "utf-8"; body { background-image: url(../img/bg.jpg); background-repeat: repeat-x; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; } header, article, footer, article, aside, time ,nav { 

   display: block;

} img { border:none; }

  1. container {

width: 960px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; } header h1 { display: block; height: 100px; width: 250px; float: right; margin-bottom: 0px; margin-top: 10px; } nav { float: left; } header nav ul { margin-top: 50px; margin-bottom: 30px; } header nav ul li{ float: left; list-style-type: none; margin-right: 10px; font-size: 12px; height: 30px; width: 90px; display: block; text-align: center; line-height: 30px; } .nav_a { color: #FFF; background-color: #00F; } header nav ul .nav_a a { color: #FFF; text-decoration: none; } header nav ul li a { color: #CCC; text-decoration: none; height: 30px; width: 90px; display: block; } header nav ul li a:hover { color: #FFF; background-color: #353331; height: 30px; width: 90px; display: block; } section article { } section article h1 { font-size: 12px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999; color: #03F; letter-spacing: 0.5em; text-align: center; padding-bottom: 10px; text-shadow:1px 1px 1px rgba(0,0,0,0.1); } .ss { float: left; height: 370px; width: 260px; margin-top: 40px; padding-right: 20px; padding-left: 20px; background-color: #F7F7F7; border: 1px solid #CCC;

/* Webkit */ -webkit-border-top-left-radius:20px; -webkit-border-top-right-radius:20px; -webkit-border-bottom-right-radius:20px; -webkit-border-bottom-left-radius:20px;

/* FF */ -moz-border-radius-topleft: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; -moz-border-radius-bottomleft: 20px;

/* IE9 */ border-top-left-radius: 20px; 

   border-top-right-radius: 20px;
   border-bottom-right-radius: 20px;
   border-bottom-left-radius: 20px;

/* IE8 */ 

   border-radius: 20px;

behavior: url(js/ie-css3.htc); } .sl { float: left; margin-left: 20px; height: 370px; width: 330px; margin-top: 40px; padding-right: 20px; padding-left: 20px; border: 1px solid #CCC; background-color: #F7F7F7;

/* Webkit */ -webkit-border-top-left-radius:20px; -webkit-border-top-right-radius:20px; -webkit-border-bottom-right-radius:20px; -webkit-border-bottom-left-radius:20px;

/* FF */ -moz-border-radius-topleft: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; -moz-border-radius-bottomleft: 20px;

/* IE9 */ border-top-left-radius: 20px; 

   border-top-right-radius: 20px;
   border-bottom-right-radius: 20px;
   border-bottom-left-radius: 20px;

/* IE8 */ 

   border-radius: 20px;

behavior: url(js/ie-css3.htc); } section h2 { font-size: 14px; letter-spacing: 0.3em; margin-left: 10px; text-shadow:1px 1px 1px rgba(0,0,0,0.1); } section h3 { font-weight: normal; color: #03F; font-size: 12px; letter-spacing: 0.3em; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #03F; padding-bottom: 5px; margin-bottom: 0px; text-align: right; text-shadow:1px 1px 1px rgba(0,0,0,0.1); } section h3 a { color: #00C; text-decoration: none; } section p { font-size: 12px; letter-spacing: 0.1em; line-height: 25px; margin-top: 0px; margin-bottom: 0px; } section aside { float: right; height: 350px; width: 230px; margin-top: 40px; border: 1px solid #CCC; background-color: #F7F7F7; margin-bottom: 40px; padding-top: 20px; padding-right: 10px; padding-left: 10px;

/* Webkit */ -webkit-border-top-left-radius:20px; -webkit-border-top-right-radius:20px; -webkit-border-bottom-right-radius:20px; -webkit-border-bottom-left-radius:20px;

/* FF */ -moz-border-radius-topleft: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; -moz-border-radius-bottomleft: 20px;

/* IE9 */ border-top-left-radius: 20px; 

   border-top-right-radius: 20px;
   border-bottom-right-radius: 20px;
   border-bottom-left-radius: 20px;

/* IE8 */ box-shadow: 0px; 

   border-radius: 20px;

behavior: url(js/ie-css3.htc); } section aside img { margin-top: 10px; } footer { background-image: url(../img/footer_bg.jpg); background-repeat: repeat-x; margin-right: auto; margin-left: auto; margin-bottom: 0px; height: 230px; width: auto; clear: right; }

  1. foot {

height: 230px; width: 940px; margin-right: auto; margin-left: auto; margin-bottom: 0px; }

  1. follow {

height: 160px; width: 270px; float: left; margin-top: 20px; }

  1. foot #follow h2 {

font-size: 16px; color: #FFF; padding-left: 20px; margin-bottom: 10px; text-shadow:0px 0px 5px #FFF;

/* IE8 */ behavior: url(js/ie-css3.htc); }

  1. foot #follow p {

font-size: 12px; line-height: 25px; margin-top: 0px; color: #FFF; }

  1. foot #follow img {

padding-right: 10px; }

  1. foot nav {

height: 160px; width: 190px; margin-top: 20px; margin-left: 40px; }

  1. foot nav h2 {

font-size: 14px; color: #FFF; text-align: center; margin-bottom: 0px; text-shadow:0px 0px 5px #FFF;

/* IE8 */ behavior: url(js/ie-css3.htc); } .footer_sub { padding-top: 37px; }

  1. foot nav ul {

margin-bottom: 0px; margin-top: 10px; }

  1. foot nav ul li {

list-style-type: none; font-size: 12px; line-height: 25px; background-image: url(../img/icon/footer_list.png); background-repeat: no-repeat; background-position: 0px; padding-left: 15px; color: #FFF; }

  1. foot nav ul li a {

color: #FFF; text-decoration: none; }

  1. foot nav ul li a:hover {

color: #333; }

  1. pr {

height: 50px; width: 200px; float: left; margin-top: 120px; font-size: 10px; text-align: right; color: #333; }

  1. foot #pr p {

margin-top: 0px; margin-bottom: 0px; }

  1. foot #pr p a {

color: #333; text-decoration: none; }

  1. copy {

height: 35px; width: 940px; float: left; border-top-width: 1px; border-top-style: solid; border-top-color: #39F; }

  1. foot #copy h3 {

font-size: 12px; margin-top: 0px; margin-bottom: 0px; line-height: 40px; color: #333; font-weight: normal; text-align: center; } </style> </head>

Retrieved from "https://openwetware.org/mediawiki/index.php?title=Template:Biomod/2014/Hokudai&oldid=820732"