Merge branch 'main' of https://git.cardiff.ac.uk/c23096663/myteam

css/common.css

+.nav1 ul .case{ 
+    background-color: #f54e46;
+    color: #fefefc ;
+} 
+.top1{
+    height: 200px;
+    background: url(../image/background.gif) repeat;
+}
+.top2{
+    padding-top: 62px;
+}
+.top2 h3,.top2 span{
+    font-size: 24px;
+    color: #fffdff;
+    padding-right: 16px;
+    float: left;
+}
+.top2 span{
+    color:#fdb3b0 ;
+    font-weight: lighter;
+}
+.top2 p{
+    font-size: 16px;
+    color: #fdb3b0;
+    padding-top: 8px;
+}
+.top3{
+    padding-top: 26px;
+    font-size: 12px;
+    color: #fdabb1;
+}
+.top3 span{
+    color: #fffffd;
+    padding: 5px 5px;
+}
+.rnav{
+    height: 118px;
+}
+.rnav li{
+    float: left;
+    font-size: 11px;
+    margin:24px 14px ;
+}
+.rnav a{
+    color: #656565;
+}
\ No newline at end of file

css/email.css

+#etable{
+        width: 871px;
+        height: 400px;
+        margin: 0 auto;
+        thead{
+          tr:nth-child(2n+1){
+            background-color: #ffffff;
+          }
+        }
+        tbody{
+          tr:nth-child(2n){
+            background-color: #fc0000;
+          }
+      
+          tr:nth-child(2n+1){
+            background-color: #942323;
+          }
+        }
+
+}
\ No newline at end of file

css/index.css

+.top {
+    background: #fefefe;
+}
+
+.title {
+    width: 130px;
+    height: 75px;
+    margin: 23px 0;
+    background-color: #f75a53;
+    color: yellow;
+}
+
+.saying img {
+    margin: 36px 24px 33px 39px;
+}
+
+.saying2 {
+    width: 300px;
+    height: 39px;
+    margin-top: 20px;
+}
+
+.saying2 p {
+    font-size: 14px;
+    color: #989a99;
+    font-style: italic;
+    line-height: 2;
+}
+
+.nav1 li {
+    padding: 30px 16px;
+    color: #000100;
+    float: left;
+    margin-top: 30px;
+}
+
+.nav1 li:hover {
+    background-color: #f75a53;
+    color: #fdfde3;
+}
+
+.banner {
+    overflow: hidden;
+    position: relative;
+    height: 460px;
+}
+
+.banner img {
+    position: absolute;
+    left: calc(50% - 720px);
+}
+
+.partner {
+    height: 385px;
+    background-color: #f7f7f7;
+
+}
+
+.title2 {
+    height: 123px;
+
+}
+
+.title2 h3,
+.title3 h3,
+.title4 h3 {
+    font-size: 22px;
+    text-align: center;
+    padding-top: 39px;
+    padding-bottom: 18px;
+}
+
+.title2 p,
+.title3 p,
+.title4 p {
+    font-size: 14px;
+    text-align: center;
+    padding-bottom: 28px;
+}
+
+.title2 p,
+.title3 p,
+.title4 p {
+    color: #999999;
+}
+
+.pimg ul li {
+    float: left;
+    border: 1px solid #ededed;
+    width: 188px;
+    height: 100px;
+
+}
+
+.pimg ul li img {
+    width: 150px;
+    height: 180px;
+    text-align: center;
+    vertical-align: middle;
+    /* padding-top: 30px; */
+    /* padding-left: 20px; */
+}
+
+.news {
+    margin-right: 60px;
+    margin-top: -100px;
+}
+
+.news dl {
+    float: left;
+    margin-right: 60px;
+    width: 320px;
+}
+
+.news dl dt {
+    font-size: 18px;
+    color: #000000;
+    font-weight: bold;
+    margin-bottom: 30px;
+}
+
+.news dl dd {
+    font-size: 12px;
+    line-height: 30px;
+}
+
+.news dl dd span {
+    float: right;
+    color: #8b8786;
+    line-height: 30px;
+}
+
+.news a {
+    color: #8b8786;
+}
+
+.news img {
+    margin-top: 26px;
+}
+
+.bottom {
+    margin-top: 44px;
+    height: 138px;
+    background-color: #363636;
+}
+
+.lianjie {
+    padding-top: 28px;
+}
+
+.bottom p {
+    text-align: center;
+    box-sizing: border-box;
+    font-size: 12px;
+    color: #797979;
+    line-height: 30px;
+}
+
+.bottom a {
+    color: #797979;
+}
+
+.bottom span {
+    margin: auto 10px;
+}
\ No newline at end of file

Extreme Ironing/css/index.css → css/memberhomepages.css

-.top {
-    background: #fefefe;
-}
-
-.title {
-    width: 130px;
-    height: 75px;
-    margin: 23px 0;
-    background-color: #f75a53;
-    color: yellow;
-}
-
-.saying img {
-    margin: 36px 24px 33px 39px;
-}
-
-.saying2 {
-    width: 300px;
-    height: 39px;
-    margin-top: 20px;
-}
-
-.saying2 p {
-    font-size: 14px;
-    color: #989a99;
-    font-style: italic;
-    line-height: 2;
-}
-
-.nav1 li {
-    padding: 30px 16px;
-    color: #000100;
-    float: left;
-    margin-top: 30px;
-}
-
-.nav1 li:hover {
-    background-color: #f75a53;
-    color: #fdfde3;
-}
+.top {
+    background: #fefefe;
+}
+
+.title {
+    width: 130px;
+    height: 75px;
+    margin: 23px 0;
+    background-color: #f75a53;
+    color: yellow;
+}
+
+.saying img {
+    margin: 36px 24px 33px 39px;
+}
+
+.saying2 {
+    width: 300px;
+    height: 39px;
+    margin-top: 20px;
+}
+
+.saying2 p {
+    font-size: 14px;
+    color: #989a99;
+    font-style: italic;
+    line-height: 2;
+}
+
+.nav1 li {
+    padding: 30px 16px;
+    color: #000100;
+    float: left;
+    margin-top: 30px;
+}
+
+.nav1 li:hover {
+    background-color: #f75a53;
+    color: #fdfde3;
+}
\ No newline at end of file
+
+.profile{
+    border: 1px solid #000100;
+    width: 200px;
+    height: 350px;
+    position: relative;
+    top:200px;
+    left:150px;
+
+}
+.profile img{
+    position: absolute;
+    width: 100%;
+    height: auto;
+    left:1px;
+
+
+}
+.profile h3{
+    position: relative;
+    left: 20px;
+    top: 150px;
+}
+.profile p{
+    position: relative;
+    left: 20px;
+    top: 150px;
+}
+.information{
+    border: 1px solid #000100;
+    width: 1000px;
+    height: 600px;
+    position: relative;
+    top:-152px;
+    left:350px;
+
+}
+.content{
+    position: absolute;
+    border: 1px solid #000100;
+    width: 900px;
+    height: 520px;
+    left:53px;
+    top:40px;
+
+}
+.content p{
+    line-height: 30px;
+}

Extreme Ironing/css/reset.css → css/reset.css

-*{
-    margin: 0;
-    padding: 0;
-    line-height: 1;
-}
-a{
-    text-decoration: none;
-}
-li{
-    list-style: none;
-}
-img{
-    vertical-align: middle;
-    border: none;
-}
-.clearfix:after{
-    content: "";
-    display: block;
-    clear: both;
-    height:0 ;
-    overflow: hidden;
-    visibility: hidden;
-}
-.safe{
-    width: 1140px;
-    margin: 0 auto;
-}
-.left{
-    float: left;
-}
-.right{
-    float: right;
+*{
+    margin: 0;
+    padding: 0;
+    line-height: 1;
+}
+a{
+    text-decoration: none;
+}
+li{
+    list-style: none;
+}
+img{
+    vertical-align: middle;
+    border: none;
+}
+.clearfix:after{
+    content: "";
+    display: block;
+    clear: both;
+    height:0 ;
+    overflow: hidden;
+    visibility: hidden;
+}
+.safe{
+    width: 1140px;
+    margin: 0 auto;
+}
+.left{
+    float: left;
+}
+.right{
+    float: right;
 }
\ No newline at end of file

html/email.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="../css/reset.css">
+    <link rel="stylesheet" href="../css/index.css">
+    <link rel="stylesheet" href="../css/email.css">
+    <link rel="stylesheet" href="../css/common.css">
+</head>
+
+<body>
+    <div class="top safe">
+        <!-- title -->
+        <div class="title left">
+            <h1>Extreme Ironing</h1>
+        </div>
+        <div class="saying left">
+            <img src="../image/l.gif" alt="渐变竖线">
+
+        </div>
+        <div class="saying2 left">
+            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+                locations and iron items of clothing. </p>
+        </div>
+
+        <!-- nav -->
+        <div class="nav1 right">
+            <ul>
+                <li><a href="../html/index.html">index</a></li>
+                <li><a href="../html/personProfile.html">member information</a></li>
+                <li><a href="../html/news.html">news</a></li>
+                <li><a href="../html/timeTable.html">timetable</a></li>
+                <li><a href="../html/email.html">contact us</a></li>
+                <li><a href="../html/page.html">ask us</a</li>
+                <li><a href="../html/profil.html">VIP</a></li>
+            </ul>
+        </div>
+    </div>
+    <div class="top1">
+    </div>
+    <div >
+        <table id="etable">
+            <thead>
+                <td class="head" style="width: 204px;">name</td>
+                <td class="head" style="width: 176px;">club</td>
+                <td class="head" style="width: 190px;">address</td>
+                <td class="head">updatetime</td>
+            </thead>
+            <tbody>
+                <tr>
+                    <td>run</td>
+                    <td>outside</td>
+                    <td>guerrillamail.com/zh/</td>
+                    <td>2024-10-10</td>
+                </tr>
+                <tr>
+                    <td>run</td>
+                    <td>outside</td>
+                    <td>guerrillamail.com/zh/</td>
+                    <td>2024-10-10</td>
+                </tr>
+                <tr>
+                    <td>run</td>
+                    <td>outside</td>
+                    <td>guerrillamail.com/zh/</td>
+                    <td>2024-10-10</td>
+                </tr>
+                <tr>
+                    <td>run</td>
+                    <td>outside</td>
+                    <td>guerrillamail.com/zh/</td>
+                    <td>2024-10-10</td>
+                </tr>
+                <tr>
+                    <td>run</td>
+                    <td>outside</td>
+                    <td>guerrillamail.com/zh/</td>
+                    <td>2024-10-10</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+</body>
+
+</html>

html/index.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="../css/reset.css">
+    <link rel="stylesheet" href="../css/index.css">
+</head>
+
+<body>
+    <div class="top safe">
+        <!-- title -->
+        <div class="title left">
+            <h1>Extreme Ironing</h1>
+        </div>
+        <div class="saying left">
+            <img src="../image/l.gif" alt="渐变竖线">
+
+        </div>
+        <div class="saying2 left">
+            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+                locations and iron items of clothing. </p>
+        </div>
+
+        <!-- nav -->
+        <div class="nav1 right">
+            <ul>
+                <li><a href="../html/index.html">index</a></li>
+                <li><a href="../html/personProfile.html">member information</a></li>
+                <li><a href="../html/news.html">news</a></li>
+                <li><a href="../html/timeTable.html">timetable</a></li>
+                <li><a href="../html/email.html">contact us</a></li>
+                <li><a href="../html/page.html">ask us</a</li>
+                <li><a href="../html/profil.html">VIP</a></li>
+            </ul>
+        </div>
+        <div class="banner safe">
+            <img src="../image/banner.gif">
+        </div>
+        <div class="partner safe">
+            <div class="title2">
+                <h3>Partners members</h3>
+                <p>Sincere, total win, meticulous</p>
+            </div>
+            <div class="pimg">
+                <ul>
+                    <li><img src="../image/partner/1.gif" alt="1"></li>
+                    <li><img src="../image/partner/2.gif" alt="2"></li>
+                    <li><img src="../image/partner/3.gif" alt="3"></li>
+                    <li><img src="../image/partner/4.gif" alt="4"></li>
+                    <li><img src="../image/partner/5.gif" alt="5"></li>
+                    <li><img src="../image/partner/5.gif" alt="5"></li>
+                </ul>
+            </div>
+        </div>
+        <div class="news safe clearfix">
+            <div class="title3">
+                <h3>news</h3>
+                <p>rencently news</p>
+            </div>
+            <dl>
+                <dt>Company News</dt>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+            </dl>
+            <dl>
+                <dt>Industy News</dt>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+            </dl>
+            <dl>
+                <dt>Media reports</dt>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+                <dd><a href="#">Extreme ironing was invented in 1997 in Leicester</a><span>10-10</span></dd>
+            </dl>
+        </div>
+
+
+    </div>
+    <div class="bottom">
+        <p class="lianjie">
+            <a href="../html/index.html">index</a><span>|</span>
+            <a href="../html/personProfile.html">person member</a><span>|</span>
+            <a href="../html/news.html">news</a><span>|</span>
+            <a href="../html/timeTable.html">timetable</a><span>|</span>
+            <a href="../html/email.html">contact us</a><span>|</span>
+            <a href="../html/page.html">ask us</a><span>|</span>
+            <a href="../html/profil.html">VIP</a>
+        </p>
+        <p>Copyright &copy; xxxxxxxxxxxxxxxxxxxxxxxxxx</p>
+        <p>phone:xxxxxxxxxx E-mail :xxxxxxxxxxxxxxxxx location:xxxxxxxxxxxxxxxxxxxxxxx</p>
+    </div>
+
+</body>
+
+</html>
\ No newline at end of file

html/news.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="../css/reset.css">
+    <link rel="stylesheet" href="../css/index.css">
+    <link rel="stylesheet" href="../css/email.css">
+    <link rel="stylesheet" href="../css/common.css">
+</head>
+
+<body>
+    <div class="top safe">
+        <!-- title -->
+        <div class="title left">
+            <h1>Extreme Ironing</h1>
+        </div>
+        <div class="saying left">
+            <img src="../image/l.gif" alt="渐变竖线">
+
+        </div>
+        <div class="saying2 left">
+            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+                locations and iron items of clothing. </p>
+        </div>
+
+        <!-- nav -->
+        <div class="nav1 right">
+            <ul>
+                <li><a href="../html/index.html">index</a></li>
+                <li><a href="../html/personProfile.html">member information</a></li>
+                <li><a href="../html/news.html">news</a></li>
+                <li><a href="../html/timeTable.html">timetable</a></li>
+                <li><a href="../html/email.html">contact us</a></li>
+                <li><a href="../html/page.html">ask us</a</li>
+                <li><a href="../html/profil.html">VIP</a></li>
+            </ul>
+        </div>
+    </div>
+    <div class="top1">
+    </div>
+    <div >
+        <table id="etable">
+            <tr>
+                <th>title</th>
+                <th>describe</th>
+                <th>link</th>
+            </tr>
+            <tr>
+                <th>sport news</th>
+                <th>British Journal of Sports Medicine (BJSM) is a multimedia portal for authoritative original research, systematic reviews, consensus statements and debate in sport and exercise medicine (SEM). 
+                    We define sport and exercise medicine broadly.</th>
+                <th>&nbsp&nbsp&nbsp&nbsp<a href="https://bjsm.bmj.com/">bjsm</a>&nbsp&nbsp&nbsp&nbsp&nbsp</th>
+            </tr>
+            <tr>
+                <th>sport news</th>
+                <th>British Journal of Sports Medicine (BJSM) is a multimedia portal for authoritative original research, systematic reviews, consensus statements and debate in sport and exercise medicine (SEM). 
+                    We define sport and exercise medicine broadly.</th>
+                <th><a href="https://www.espn.co.uk/">espn</a></th>
+            </tr>
+            <tr>
+                <th>sport news</th>
+                <th>British Journal of Sports Medicine (BJSM) is a multimedia portal for authoritative original research, systematic reviews, consensus statements and debate in sport and exercise medicine (SEM). 
+                    We define sport and exercise medicine broadly.</th>
+                <th><a href="https://www.sofascore.com/">sofascore</a></th>
+            </tr>
+            <tr>
+                <th>sport news</th>
+                <th>British Journal of Sports Medicine (BJSM) is a multimedia portal for authoritative original research, systematic reviews, consensus statements and debate in sport and exercise medicine (SEM). 
+                    We define sport and exercise medicine broadly.</th>
+                <th><a href="https://bjsm.bmj.com/">bjsm</a></th>
+            </tr>
+            <tr>
+                <th>sport news</th>
+                <th>British Journal of Sports Medicine (BJSM) is a multimedia portal for authoritative original research, systematic reviews, consensus statements and debate in sport and exercise medicine (SEM). 
+                    We define sport and exercise medicine broadly.</th>
+                <th><a href="https://bjsm.bmj.com/">bjsm</a></th>
+            </tr>
+        </table>
+    </div>
+</body>
+
+</html>

html/page.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="../css/reset.css">
+    <link rel="stylesheet" href="../css/index.css">
+    <link rel="stylesheet" href="../css/email.css">
+    <link rel="stylesheet" href="../css/common.css"> 
+</head>
+
+<body>
+    <div class="top safe">
+        <!-- title -->
+        <div class="title left">
+            <h1>Extreme Ironing</h1>
+        </div>
+        <div class="saying left">
+            <img src="../image/l.gif" alt="渐变竖线">
+
+        </div>
+        <div class="saying2 left">
+            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+                locations and iron items of clothing. </p>
+        </div>
+
+        <!-- nav -->
+        <div class="nav1 right">
+            <ul>
+                <li><a href="../html/index.html">index</a></li>
+                <li><a href="../html/personProfile.html">member information</a></li>
+                <li><a href="../html/news.html">news</a></li>
+                <li><a href="../html/timeTable.html">timetable</a></li>
+                <li><a href="../html/email.html">contact us</a></li>
+                <li><a href="../html/page.html">ask us</a</li>
+                <li><a href="../html/profil.html">VIP</a></li>
+            </ul>
+        </div>
+    </div>
+    <div class="top1">
+    </div>
+    <h1>Extrem Iorning</h1>
+    <div>
+        <p>
+            Extreme ironing was invented in 1997 in Leicester, England, by resident Phil Shaw in his back garden.[2] Shaw
+            came home
+            from what he recalls as a hard day in a Leicester knitwear factory.[7] Shaw had a number of chores to do,
+            including
+            ironing. Preferring the idea of an evening out rock climbing, he decided to combine the two activities into a
+            new
+            extreme sport. In June 1999, Shaw, who uses the nickname "Steam", embarked on an international tour to promote
+            the
+            activity. The stops included the United States, Fiji, New Zealand, Australia and South Africa. An encounter with
+            German
+            tourists in New Zealand led to the formation of a group called "Extreme Ironing International", and the German
+            Extreme
+            Ironing Section or GEIS.[citation needed] This has yet to popularize in North America.
+        </p>
+        <p>
+            As extreme ironing has branched off, the conditions can gain in extreme activity. For example, a branch of
+            ironing has
+            been developed that includes both bungee jumping and well-pressed clothing. Bungee ironing is what some would
+            call the
+            ultimate in the thrill of extreme ironing.[8]
+        </p>
+        <p>
+            The first competition for extreme ironing took place in Germany in 2002. Eighty teams competed in an obstacle
+            course in
+            which the competitors had to iron different articles of clothing in different dangerous settings. These settings
+            included hanging from a tree, scaling a wall, and climbing under the hood of a car. A common misconception would
+            be that
+            competitors are scored only on how dangerous the location of their ironing is. But, the most significant part of
+            scoring
+            is actually how many wrinkles are left on the clothing and how the competitor chooses to iron the clothes.
+            Competitors
+            are scored for the quality of the pressing, style, and speed. Quality of the pressing counts for half of the
+            points
+            scored.
+        </p>
+        <p></p>
+        <p></p>
+    </div>
+    <h3>Please write your comments</h3>
+    <textarea name="comments" id="comments-input" placeholder="write your comments" maxlength="500"></textarea>
+    <h1></h1>
+    <button type="submit" id="tijiao">submit</button>
+    <script>
+        document.getElementById('tijiao').addEventListener('click', function () {
+            alert('success submit')
+        })
+    </script>
+    <style>
+        textarea {
+            width: 500px;
+            height: 80px;
+            font-size: 18px;
+            resize: unset;
+        }
+    </style>
+</body>
+
+</html>
\ No newline at end of file

html/personProfile.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>member information</title>
+  <link rel="stylesheet" href="../css/memberhomepages.css">
+  <link rel="stylesheet" href="../css/reset.css">
+</head>
+<body>
+<div class="top safe">
+  <!-- title -->
+  <div class="title left">
+    <h1>Extreme Ironing</h1>
+  </div>
+  <div class="saying left">
+    <img src="../image/l.gif" alt="渐变竖线">
+
+  </div>
+  <div class="saying2 left">
+    <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+      locations and iron items of clothing. </p>
+  </div>
+
+  <!-- nav -->
+  <div class="nav1 right">
+    <ul>
+        <li><a href="../html/index.html">index</a></li>
+        <li><a href="../html/personProfile.html">member information</a></li>
+        <li><a href="../html/news.html">news</a></li>
+        <li><a href="../html/timeTable.html">timetable</a></li>
+        <li><a href="../html/email.html">contact us</a></li>
+        <li><a href="../html/page.html">ask us</a</li>
+        <li><a href="../html/profil.html">VIP</a></li>
+    </ul>
+  </div>
+</div>
+
+<div class="profile">
+  <img src="../image/u=2662935961,3025118511&fm=253&fmt=auto&app=138&f=JPEG.webp" alt="member photo">
+  <h3>hahaha haha</h3>
+  <br>
+  <p>love ext. ironing</p>
+  </div>
+<div class="information">
+  <h2>main information</h2>
+  <div class="content">
+    <p>
+      &nbsp;&nbsp;&nbsp;&nbsp;I love ext,ironing, Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote locations and iron items of clothing. According to the Extreme Ironing Bureau, extreme ironing is "the latest dangerous sport that combines the thrills of an extreme outdoor activity with the satisfaction of a well-pressed shirt."
+
+      Part of the attraction and interest the media has shown towards extreme ironing seems to center on the issue of whether it is really a sport or not. It is widely considered to be tongue-in-cheek.
+
+      Some locations where such performances have taken place include a mountainside of a difficult climb; a forest; in a canoe; while skiing or snowboarding; on top of large bronze statues; in the middle of a street; underwater; in the middle of the M1 motorway; in a keirin cycle race; while parachuting; and under the ice sheet of a frozen lake. The performances have been conducted solo or by groups.
+    </p>
+
+  </div>
+
+</div>
+
+
+
+
+
+
+
+
+
+</body>
+</html>

html/profil.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="../css/reset.css">
+    <link rel="stylesheet" href="../css/index.css">
+    <link rel="stylesheet" href="../css/email.css">
+    <link rel="stylesheet" href="../css/common.css">
+    <style>
+        ol li{
+            margin-left: 20px; list-style: decimal
+        }
+    </style>
+</head>
+
+<script>
+      window.onload=function show(){
+    var str="Sports club members typically enjoy the following privileges"
+       document.getElementById('showDiv').innerHTML='<h2 id="p1"></h2>';
+       var content=""
+       for(let i=1;i<=str.length;i++){
+           if((i%100)!=0){
+                content= content+str[i-1]
+               
+           }else{
+               content= content+str[i-1]+'</br>'
+           }
+           
+       }
+       document.getElementById('p1').innerHTML=content
+  }
+</script>
+<body>
+    <div class="top safe">
+        <!-- title -->
+        <div class="title left">
+            <h1>Extreme Ironing</h1>
+        </div>
+        <div class="saying left">
+            <img src="../image/l.gif" alt="渐变竖线">
+
+        </div>
+        <div class="saying2 left">
+            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+                locations and iron items of clothing. </p>
+        </div>
+
+        <!-- nav -->
+        <div class="nav1 right">
+            <ul>
+                <li><a href="../html/index.html">index</a></li>
+                <li><a href="../html/personProfile.html">member information</a></li>
+                <li><a href="../html/news.html">news</a></li>
+                <li><a href="../html/timeTable.html">timetable</a></li>
+                <li><a href="../html/email.html">contact us</a></li>
+                <li><a href="../html/page.html">ask us</a</li>
+                <li><a href="../html/profil.html">VIP</a></li>
+            </ul>
+        </div>
+    </div>
+    <div class="top1">
+    </div>
+    <div id="showDiv" style=" width: 871px;height: 50px;margin: 0 auto;"></div>
+    
+        <ol style="background-color: aquamarine;">
+            <li><h3>Exclusive Access to Facilities:</h3> Members have priority access to various sports facilities such as gyms, swimming pools, tennis courts, basketball courts, etc., and may have priority booking rights during peak hours.</li>
+            <li><h3>Member-Exclusive Classes and Training Programs: </h3>Clubs offer exclusive fitness classes, personal training sessions, and customized training programs to help members achieve their health and fitness goals.</li>
+            <li><h3>Discounted Rates:</h3> Members enjoy various discounts provided by the club, including fitness classes, merchandise, facility bookings, and event registrations.</li>
+            <li><h3>Social Events:</h3> Members have the opportunity to participate in social events and competitions organized by the club, helping them to expand their social network and connect with like-minded individuals.</li>
+            <li><h3>Health and Nutrition Consultation:</h3> Some clubs provide professional health and nutrition consulting services to help members develop scientific dietary plans and healthy lifestyles.</li>
+            <li><h3>High-Quality Service and Facility Maintenance:</h3> Clubs usually offer members higher-quality services and well-maintained facilities, such as comfortable locker rooms, saunas, and massage services.</li>
+            <li><h3>Exclusive Events and Experiences:</h3> Members may have the opportunity to participate in exclusive events organized by the club, such as celebrity lectures, training camps, and outdoor adventures.</li>
+        </ol>
+    </div>
+</body>
+
+</html>

Extreme Ironing/html/index.html → html/timeTable.html

-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Document</title>
-    <link rel="stylesheet" href="../css/reset.css">
-    <link rel="stylesheet" href="../css/index.css">
-</head>
-
-<body>
-    <div class="top safe">
-        <!-- title -->
-        <div class="title left">
-            <h1>Extreme Ironing</h1>
-        </div>
-        <div class="saying left">
-            <img src="../image/l.gif" alt="渐变竖线">
-
-        </div>
-        <div class="saying2 left">
-            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
-                locations and iron items of clothing. </p>
-        </div>
-
-        <!-- nav -->
-        <div class="nav1 right">
-            <ul>
-                <li>index</li>
-                <li>about us</li>
-                <li>news</li>
-                <li>order us</li>
-                <li>contact us</li>
-                <li>ask us</li>
-                <li>contact us</li>
-            </ul>
-        </div>
-    </div>
-</body>
-
-</html>
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="../css/reset.css">
+    <link rel="stylesheet" href="../css/index.css">
+    <link rel="stylesheet" href="../css/email.css">
+    <link rel="stylesheet" href="../css/common.css">
+</head>
+
+<body>
+    <div class="top safe">
+        <!-- title -->
+        <div class="title left">
+            <h1>Extreme Ironing</h1>
+        </div>
+        <div class="saying left">
+            <img src="../image/l.gif" alt="渐变竖线">
+
+        </div>
+        <div class="saying2 left">
+            <p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
+                locations and iron items of clothing. </p>
+        </div>
+
+        <!-- nav -->
+        <div class="nav1 right">
+            <ul>
+                <li><a href="../html/index.html">index</a></li>
+                <li><a href="../html/personProfile.html">member information</a></li>
+                <li><a href="../html/news.html">news</a></li>
+                <li><a href="../html/timeTable.html">timetable</a></li>
+                <li><a href="../html/email.html">contact us</a></li>
+                <li><a href="../html/page.html">ask us</a</li>
+                <li><a href="../html/profil.html">VIP</a></li>
+            </ul>
+        </div>
+    </div>
+    <div class="top1">
\ No newline at end of file
+    </div>
+    <div >
+        <table id="etable">
+            <tr>
+                <th>Time</th>
+                <th>Context</th>
+                <th>member</th>
+            </tr>
+            <tr>
+                <th>2020-10-10</th>
+                <th>running</th>
+                <th>Tom</th>
+            </tr>
+            <tr>
+                <th>2020-10-10</th>
+                <th>running</th>
+                <th>Tom</th>
+            </tr>
+            <tr>
+                <th>2020-10-10</th>
+                <th>running</th>
+                <th>Tom</th>
+            </tr>
+            <tr>
+                <th>2020-10-10</th>
+                <th>running</th>
+                <th>Tom</th>
+            </tr>
+            <tr>
+                <th>2020-10-10</th>
+                <th>running</th>
+                <th>Tom</th>
+            </tr>
+        </table>
+    </div>
+</body>
+
+</html>