Artificial Intelligence Programming Lab(AIPLab) 討論區

課程相關活動 => HTML5網頁程式設計 => 主題作者是: admin 於 三月 06, 2016, 11:49:37 pm



主題: main.php
作者: admin三月 06, 2016, 11:49:37 pm
原始程式
程式碼: [Select]
<html>
  <head>
    <title><?php echo $S['username'?>報名科學班</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  </head>
  <body>
    <p align="center"><img src="images/title.jpg"></p>
    <p align="center">
      填寫報名資料&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="modify_change.php">填寫/修改報名資料</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="page1.php" target="_blank">列印報名資料表</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="page2.php" target="_blank">列印評估觀察表</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="page3.php" target="_blank">列印甄選證</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
      <a href="page4.php" target="_blank">列印服務申請表<i>(無則免附)</i></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    
      <a href="pass_change.php">密碼變更</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
      <a href="logout.php">登出網站</a>
    </p>
  </body>
</html>


主題: 回覆: main.php
作者: admin三月 06, 2016, 11:50:47 pm
使用者驗證
程式碼: [Select]
<?php
session_start
();
if(empty(
$_SESSION['authenticated']))
{
  
header('Location: index.php');
  exit;
}
$S $_SESSION['student_data'];
?>


主題: 回覆: main.php
作者: admin三月 06, 2016, 11:52:28 pm
標題影像的RWD
原始的標題影像
程式碼: [Select]
<p align="center"><img src="images/title.jpg"></p>RWD的標題影像
程式碼: [Select]
    <div class="container">
    <div class="row">
      <div class="col-xs-12 col-md-8 col-md-offset-2">
        <div class="text-center"><img src="images/title.jpg" class="img-responsive" alt="title">
        </div>
      </div>
    </div>
  </div>


主題: 回覆: main.php
作者: admin三月 07, 2016, 12:34:28 am
主選單
原本的主選單:
程式碼: [Select]
<p align="center">
      填寫報名資料&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="modify_change.php">填寫/修改報名資料</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="page1.php" target="_blank">列印報名資料表</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="page2.php" target="_blank">列印評估觀察表</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <a href="page3.php" target="_blank">列印甄選證</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
      <a href="page4.php" target="_blank">列印服務申請表<i>(無則免附)</i></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    
      <a href="pass_change.php">密碼變更</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
      <a href="logout.php">登出網站</a>
    </p>
RWD的主選單
程式碼: [Select]
<nav class="navbar navbar-default">
  <div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">填寫報名資料</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="modify_change.php">填寫/修改報名資料</a></li>
        <li role="separator" class="divider"></li>
        <li><a href="page1.php" target="_blank">列印報名資料表</a></li>
        <li><a href="page2.php" target="_blank">列印評估觀察表</a></li>
        <li><a href="page3.php" target="_blank">列印甄選證</a></li>
        <li><a href="page4.php" target="_blank">列印服務申請表<i>(無則免附)</i></a></li>
        <li role="separator" class="divider"></li>
        <li><a href="pass_change.php">密碼變更</a></li>
        <li><a href="logout.php">登出網站</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>


主題: 回覆: main.php
作者: admin三月 07, 2016, 12:35:55 am
自定顏色
http://work.smarchal.com/twbscolor/ (http://work.smarchal.com/twbscolor/)
程式碼: [Select]
<style type="text/css">
  .navbar-default {
  background-color: #f2f6eb;
  border-color: #c5f68b;
}
.navbar-default .navbar-brand {
  color: #35a4bf;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #1b29dd;
}
.navbar-default .navbar-text {
  color: #35a4bf;
}
.navbar-default .navbar-nav > li > a {
  color: #35a4bf;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #1b29dd;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #1b29dd;
  background-color: #c5f68b;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #1b29dd;
  background-color: #c5f68b;
}
.navbar-default .navbar-toggle {
  border-color: #c5f68b;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #c5f68b;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #35a4bf;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #35a4bf;
}
.navbar-default .navbar-link {
  color: #35a4bf;
}
.navbar-default .navbar-link:hover {
  color: #1b29dd;
}

@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #35a4bf;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #1b29dd;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #1b29dd;
    background-color: #c5f68b;
  }
}
  </style>