第一個網頁設計和代碼，Dreamweaver HTML和CSS

我剛剛設計了一個非常快速的網站主頁，作爲第一次編碼器，我想知道是否有人會看設計和我的代碼，並告訴我他們會在哪裏進行改進或在必要時更改或完全更改！第一個網頁設計和代碼，Dreamweaver HTML和CSS

該設計僅供個人使用，幷包含黑色部分，我的個人地址在網站設計上。

我接受任何建議和意見，因爲這是我第一次進行編碼，我想知道更多的經驗人會做得更好。我一直在使用Dreamweaver並在谷歌瀏覽器上查看，有一個HTML代碼和一個CSS代碼，理想情況下我希望它可以在不同的瀏覽器上查看。

HTML

<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8"> 
<title> Rosy's Jewellery</title> 
<link rel="stylesheet" type="text/css" href="CSS/Stylesheet.css"> 

</head> 

<body> 

<div class="wrapper"> 

    <div class="top"> 
     <!--Background set in CSS--> 
    </div><!-- end of top--> 

    <div class="menu"> 
     <h1>Rosy's Jewellery</h1>     
     <ul id="nav">  
     <li><a href=""> Home   </a></li> 
     <li><a href=""> Jewellery  </a></li> 
     <li><a href=""> Locations  </a></li> 
     <li><a href=""> Contact Us  </a></li> 
     <li><a href=""> Reviews   </a></li> 
     </ul>  
    </div> 
    <!-- end of menu --> 


    <div class="main"> 
     <p> Welcome to Rosy's Jewellery </p> 
       <img src="Images/1.png"> 

       <img src="Images/2.png"> 

       <img src="Images/3.png"> 

       <img src="Images/4.png"> 

       <img src="Images/5.png"> 

       <img src="Images/6.png"> </div> 
<!--close main--> 



<div class="footer"> 
    <ul id="footer"> 
     <li> <img src="Images/facebook.png" /> 
     <img src="Images/twitter.png" /> </li> 
     <li> Twitter Address</li> 
     <li> Addres, Address, Address, Address </li>   
     <li> Telephone Number</li> 
    </ul> 
</div> 
<!--end of footer--> 
</div> 
</body> 
</html>

CSS

.wrapper  { 
      margin:0 auto; 
      background-color:#D1CED4; 
      } 

.top   { 
      background-color:#000000; 
      padding-bottom:2.5em; 
      } 

.menu   { 
      background-color:#FFFFFF; 
      border-bottom-width:2px; 
      border-bottom-color:#000000; 
      border-bottom-style: solid; 
      position: relative; 
      top:-15px; 
      text-align:center; 
      font-family:Andalus; 
      font-size:18px; 
      padding-left:1em; 
      padding-right:1em; 
      overflow:hidden; 
      } 

.menu h1  { 
      float:left; 
      color:#999966; 
      font-family:andalus; 
      font-size:24; 
      } 


.main   { 
      width:65%; 
      margin:0 auto; 
      background-color:#FFFFFF; 
      text-align:center; 
      font-family:andalus; 
      font-size:24px; 
      padding-top:1px; 
      } 

.footer   { 
      text-align:centre; 
      background-color:#C8C8C8; 
      color:#000000; 
      font-family:andalus; 
      margin-bottom:-1em; 
      } 

#footer li  { 
      display:inline-block; 
      padding-right:8em; 
      vertical-align:middle; 
      margin-top: -30px; 
      } 


#nav   { 
      padding-top:15px; 
      } 

#nav a   { 
      text-decoration:none; 
      } 

#nav a:link  { 
      color:black; 
      } 

#nav a:visited { 
      color:black; 
      } 

#nav a:hover { 
      color:black; 
      } 

img    { 
      margin:42px; 
      } 

#nav ul   { 
      display:inline-block; 
      } 


#nav li   { 
      display:inline-block; 
      margin-right:4.5em; 
      padding-right:2.5em; 
      }

來源

2014-01-09 user3046451

我無法看到我的設計圖片是否已上傳？任何人都可以看到它？那裏有 – user3046451

。我們可以看到 – Era

你已經聲明瞭html5文檔類型，但沒有使用任何html5標籤..任何特定的原因？ – Era