課表介面
課表程式碼(HTML)
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>課表</title>
<style>
#title {background-color: #E1E1E1;width: 960px;height: 200px;display: block;margin: auto; }
#type {background-color: #808080;width: 960px;height: 40px;display: block;margin: auto;}
#footer {
background-color: #808080;
height: 200px;
width: 960px;
margin-top: 686px;
}
.clearFloat {
clear: both;
}
/*游標變色*/
th:hover {
background-color: black;
}
th, td {
border: 1px solid #808080;
padding: 1px;
}
table {
border-spacing: 3px;
border-collapse: collapse;
width: 100%;
margin: 0auto;
}
#MyBlog {
position: fixed; /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
top: 50%; /*設置垂直位置*/
right: -50px; /*設置水平位置，依所放的內容多寡需要自行手動調整*/
background: #c6c6c6; /*背景顏色*/
padding: 10px 10px;
border-radius: 100px; /*圓角*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
width: 90px;
height:40px;
}
#MyBlog:hover { /*當滑鼠移至此區塊時，伸縮區塊*/
right:-20px;
width: 270px;
height: 40px;
}
#MyBlog #title {
padding-right: 5px; /*讓標題與連結中間有空隙*/
height: 40px;
width: 450px;
}
</style>
</head>
<body background="灰磚.jpg">
<div id="title">
<img src="我的課表2.jpg" alt="課表" height="200" width="960" style="display:block; margin:auto;" />
</div>
<div id="type">
<table border="0" style="height:40px;width:960px">
<tr>
<th style="height:35px;width:120px;font-family:微軟正黑體;font-size:18px" ><a href="主頁.html" style="text-decoration:none;color:white">個人簡介</a></th>
<th style="height:35px;width:120px;font-family:微軟正黑體;font-size:18px" bgcolor="black"><a href="課表改.html" style="text-decoration:none;color:white">個人課表</a></th>
<th style="height:35px;width:120px;font-family:微軟正黑體;font-size:18px"><a href="最愛音樂.html" style="text-decoration:none;color:white">最愛音樂</a></th>
<th style="height:35px;width:120px;font-family:微軟正黑體;font-size:18px"><a href="最愛遊戲.html" style="text-decoration:none;color:white">最愛遊戲</a></th>
<th style="height:35px;width:120px;font-family:微軟正黑體;font-size:18px"><a href="留言板改.html" style="text-decoration:none;color:white">留言板</a></th>
<th style="height:35px;width:120px;font-family:微軟正黑體;font-size:18px"><a href="計算機改.html" style="text-decoration:none;color:white">計算機</a></th>
</tr>
<table>
</div>
<div id="content" >
<center>
<caption style="font-family:'Blackadder ITC';font-size:20px;color:white;background-color:#c6c6c6;color:black;">
Curriculum
</caption>
<table border="0" style="height:660px;width:100%;table-layout:fixed;">
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;"> </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000; color:white;"> 一 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 二 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 三 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 四 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 五 </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第一節<br />0810-0900 </th>
<th style="background-color: #ffffff;"> </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="2"> 國文(二)<br />李曉萍<br />E402教室 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 程式設計進階<br />陳鍾誠<br />E320多媒體實驗室 </th>
<th style="background-color: #ffffff;"> </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="2"> 英文(二)<br />范仲如<br />E402教室 </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第二節<br />0910-1000 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 資料庫系統管理<br />王德華,馮玄明<br />I102圖資電腦教室 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 網頁設計<br />趙于翔E322<br />嵌入式實驗室 </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第三節<br />1010-1100 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="2"> 資訊科技英文導論<br />李錫捷<br />E320多媒體實驗室 </th>
<th style="background-color: #ffffff;"> </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第四節<br />1110-1200 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;"> 服務教育<br />林銘輝<br />E402教室 </th>
<th style="background-color: #ffffff;"> </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 午休<br />1200-1330 </th>
<th style="background-color: #ffffff;" colspan="5"> </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第五節<br />1330-1420 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 離散數學<br />李錫捷<br />E320多媒體實驗室 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;"> 資訊科技英文導論<br />李錫捷<br />E320多媒體實驗室 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 電腦應用軟體認證<br />陳瑞馨<br />I102圖資電腦教室 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 無人機感測技術<br />蘇東青,陳煜文<br />E105教室 </th>
<th style="background-color: #ffffff;"> </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第六節<br />1430-1520 </th>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #E1E1E1;" rowspan="3"> 資訊網路<br />柯志亨<br />E321電腦網路實驗室 </th>
<th style="background-color: #ffffff;"> </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第七節<br />1530-1620 </th>
<th style="background-color: #ffffff;"> </th>
</tr>
<tr>
<th style="font-family:微軟正黑體;font-size:14px;background-color: #000000;color:white;"> 第八節<br />1630-1720 </th>
<th style="background-color: #ffffff;"> </th>
<th style="background-color: #ffffff;"> </th>
<th style="background-color: #ffffff;"> </th>
<th style="background-color: #ffffff;"> </th>
</tr>
</table>
</center>
</div>
<div id="MyBlog">
<span id="title">
<a href="主頁.html"><img src="個人.jpg" alt="個人介紹" height="40" width="40" /></a>
<a href="課表改.html"><img src="學校.jpg" alt="課表" height="40" width="40" /></a>
<a href="最愛音樂.html"><img src="音樂.jpg" alt="音樂" height="40" width="40" /></a>
<a href="最愛遊戲.html"><img src="遊戲.jpg" alt="遊戲" height="40" width="40" /></a>
<a href="留言板改.html"><img src="留言.jpg" alt="留言板" height="40" width="40" /></a>
<a href="計算機改.html"><img src="小計算機.jpg" alt="計算機" height="40" width="40" /></a>
</span>
</div>
<center>
<div id="footer">
<img src="我的課表.jpg" alt="我的課表" height="200" width="960" style="display:block;background-repeat:repeat-x;" />
</div>
</body>
</html>
返回目錄