重建圖像內聯部分。

Question

有人可以告訴我如何使用html和css重建本節。我已經嘗試了幾次，並且不能完全正確。我只需要顯示一次，然後我就從那裏接過。目前，我正在使用Squarespace，因此可以將內容拖到頁面上，但我需要使用html和css重新插入它。感謝您的幫助

您可以從我的主頁www.jobspark.ca

Answer 1

您使用響應電網系統提供的鏈接獲取文本。如果你是html/css的新手，那麼你自己寫這個可能有點多。我建議你使用某種CSS框架。

這裏有很多，但我更喜歡的是Twitter Bootstrap，這是非常受歡迎，因此得到很好的支持。他們使用的grid system是非常堅實和響應，我一直使用它！你甚至可以在他們的網站上自定義框架，只包含你需要的部分（以防止大量開銷），或者下載源文件（.less）並自己編輯和編譯它們（它看起來很難，它們很好！記錄）

爲您提供的屏幕截圖，與自舉類的HTML會是這個樣子：

<div class='container-fluid'> 

    <div class='row-fluid'> 
     <article class='span4'> 
     <img src='...' alt='...'/> 
     <h2>The title</h2> 
     <p>Lorem ipsum dolor sit amet</p> 
     <a href='...'>Read more...</a> 
     </article> 

     <article class='span4'> 
     ... 
     </article> 

     <article class='span4'> 
     ... 
     </article> 

    </div> 
</div>