-2
@font-face {
font-family: 'Muli';
font-style: normal;
font-weight: 400;
src: local('Muli'), url(https://fonts.gstatic.com/s/muli/v7/minRpKQdEvXRRS8oAbAtWvesZW2xOQ-xsNqO47m55DA.woff) format('woff');
}
body {
\t font-family: 'Muli', Helvetica, Ariel, Georgia, serif;
\t font-size: medium;
\t margin: 0px;
}
#initial {
\t max-width: 100%;
\t max-height: 100%;
\t min-height: 100%;
\t padding: 0px;
\t margin: 0px;
}
h1 {
\t font-size: 3.5em;
\t font-style: italic;
\t font-weight: normal;
\t text-align: center;
\t border-color: red;
\t border-style: solid;
\t margin-top: 0px;
\t margin-bottom: 10px;
\t padding: 0px;
}
div.tableRow {
\t display: table-row;
}
div.tableContainer {
\t display: table;
}
#profile {
\t display: table-cell;
\t width: 250px;
\t height: auto;
\t margin-right: 20px;
\t margin-bottom: 20px;
}
#bio_text {
\t display: table-cell;
\t vertical-align: top;
\t padding-left: 20px;
\t padding-right: 20px;
}
#ccb, #cfc {
\t max-width: 100%;
\t max-height: 100%;
\t border-color: red;
\t border-style: solid;
}
#contactForm {
\t display: table-cell;
\t border-color: red;
\t border-style: solid;
}
#contactInfo {
\t display: table-cell;
\t border-color: red;
\t border-style: solid;
}
#contactInfo ul li {
\t list-style-type: none;
}
#contactInfo h2 {
\t text-align: center;
}
footer {
\t border-top-width: 1px;
\t border-top-style: solid;
\t border-top-color: black;
\t text-align: center;
}
footer ul li {
\t list-style-type: none;
\t display: inline;
\t padding: 0px 50px 0px 50px;
\t border-color: red;
\t border-style: solid;
}
footer p {
\t text-align: center;
\t border-color: red;
\t border-style: solid;
}
footer ul li a:link, footer ul li a:visited {
\t text-decoration: none;
}<!DOCTYPE html>
<html>
\t <head>
\t \t <meta charset="utf-8">
\t \t <title>Chris Wang</title>
\t \t <link rel="stylesheet" type="text/css" href="homepage.css">
\t </head> \t
\t <body>
\t \t <header>
\t \t \t <img id="initial" src="img/background_final.jpg" alt="Chris Wang">
\t \t </header>
\t \t <section id="bio">
\t \t \t <h1>Who Am I?</h1>
\t \t \t <div class="tableContainer">
\t \t \t \t <div class="tableRow">
\t \t \t \t \t <div id="bio_text">
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t blah blah blah personal description
\t \t \t \t \t \t </p>
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t personal description
\t \t \t \t \t \t </p>
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t more personal stuffs
\t \t \t \t \t \t </p>
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t more personal stuffs
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t \t <img id="profile" src="img/profile_edit.jpg" alt="This is me!">
\t \t \t \t </div>
\t \t \t </div>
\t \t </section>
\t \t <h1>What Have I Done?</h1>
\t \t <section id="past">
\t \t \t <div class="tableRow">
\t \t \t \t <div id="ccb">
\t \t \t \t \t <a href="pages/ccb/index.html">
\t \t \t \t \t \t <img id="ccb_thumbnail" src="pages/ccb/img/thumbnail_resize.jpg" alt="Cranbrook Culture Book">
\t \t \t \t \t </a>
\t \t \t \t </div>
\t \t \t \t <div id="cfc">
\t \t \t \t \t <a href="pages/cfc/index.html">
\t \t \t \t \t \t <img id="cfc_thumbnail" src="pages/cfc/img/thumbnail_resize.jpg" alt="Cranes for Change">
\t \t \t \t \t </a>
\t \t \t \t </div>
\t \t \t \t <!--<div id="trombetta">
\t \t \t \t \t <a href="pages/trombetta/index.html">
\t \t \t \t \t \t <img id="trombetta_thumbnail" src="pages/trombetta/img/thumbnail.jpg" alt="Trombetta Intern">
\t \t \t \t \t </a>
\t \t \t \t </div>-->
\t \t \t </div>
\t \t </section>
\t \t <h1>Let's Talk!</h1>
\t \t <div class="tableContainer">
\t \t \t <fieldset id="contactForm">
\t \t \t \t <form action="contact.php" method="post">
\t \t \t \t <div class="tableRow">
\t \t \t \t \t <label for="name">Full Name:</label>
\t \t \t \t \t <input type="text" id="name" name="name" value="" placeholder="Steve Jobs" required>
\t \t \t \t </div class="tableRow">
\t \t \t \t <div class="tableRow">
\t \t \t \t \t <label for="email">Email Address:</label>
\t \t \t \t \t <input type="email" id="email" name="email" value="" placeholder="[email protected]" required>
\t \t \t \t </div>
\t \t \t \t <div class="tableRow">
\t \t \t \t \t <label for="phone">Phone Number:</label>
\t \t \t \t \t <input type="tel" id="phone" name="phone" value="" placeholder="(000)-000-0000">
\t \t \t \t </div>
\t \t \t \t <div class="tableRow">
\t \t \t \t \t <label for="message">Message:</label>
\t \t \t \t \t <textarea id="message" name="message" required></textarea>
\t \t \t \t </div>
\t \t \t \t <div class="tableRow">
\t \t \t \t \t <label></label>
\t \t \t \t \t <input type="submit" value="Send!">
\t \t \t \t </div>
\t \t \t </fieldset>
\t \t \t <div id="contactInfo">
\t \t \t \t <h2>Contact Info</h2>
\t \t \t \t <ul>
\t \t \t \t \t <li>Chris Wang</li>
\t \t \t \t \t <li>chriswang.work</li>
\t \t \t \t \t <li><a href="mailto:[email protected]" title="My Email">[email protected]</a> \t </li>
\t \t \t \t \t <li><a href="tel:+##########" title="My Number">###-###-####</a></li>
\t \t \t \t </ul>
\t \t \t \t <img id="linkedin" src="img/linkedin.png" alt="LinkedIn Account">
\t \t \t \t <img id="twitter" src="img/twitter.png" alt="Twitter Account">
\t \t \t </div>
\t \t </div>
\t \t <footer>
\t \t \t <ul>
\t \t \t \t <li><a href="homepage.html#bio" title="Bio">Bio</a></li>
\t \t \t \t <li><a href="homepage.html#past" title="Experience">Experience</a></li>
\t \t \t \t <li><a target="_blank" href="file/resume.pdf" title="Resume">Resume</a></li>
\t \t \t \t <li><a href="pages/quotes/index.html" title="My Favorite Quotes">Quotes</a></li>
\t \t \t </ul>
\t \t \t <p>© 2016 Chris Wang</p>
\t \t </footer>
\t </body>
</html>我試圖建立一個個人網站，有隻用HTML & CSS整頁幻燈片（也許有點超簡單的PHP的後端的東西），這裏有什麼我的例子m談論的內容：http://www.hannahsilverton.com
現在我使用jpeg打開幻燈片的最大高度和重量規則，其中我使用photoshop將我的初始圖層分層放置在一張酷圖上。但是，當我似乎無法弄清楚如何將我的2段生物W /圖片製作成整頁幻燈片。
此外，我在過去的體驗部分也遇到了麻煩。我想讓它們以屏幕上的幾張牌的形式出現（每卷2或3張）。但是，當我使用表格顯示w/css時，它所做的只是將兩張卡片放在一起（與使用內聯的結果相同）。
提前致謝！我剛剛在一個月前瞭解到了這種語言，所以請原諒，如果我做任何noob錯誤：P
最後，如果有人想看我現在有的代碼，請在下面評論，我會收件箱。
再次感謝！
你能告訴我們你的代碼？請用你的html和css創建一個**工作** [片段]（https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/）。 –
當然！掛上讓我想出如何快速地做到這一點 –
看到這個網站：http://alvarotrigo.com/fullPage/#firstPage 或這（fullPage.js + Bootstrap 3）：http://demo.w3developer.de/fullpage /＃home –