自定义骨架响应式布局

Question

我在一个使用 Get Skeleton responsive boilerplate and am trying to create this layout 的网站上工作。灰色方块代表图像。

如有任何关于如何实现此目的的想法，我们将不胜感激！

谢谢！

Answer 1

这是基本结构，你可以改变高度/宽度

<style>
    .greybox{   
        background-color:#eee;
        width:100%;
        height:200px;
        margin-bottom:4%;
    }
  </style>

<div class="u-full-width">
    <div class="row">
      <div class="four columns">
        <div class="row">
            <div class="greybox">&nbsp;</div>
        </div>
        <div class="row">
            <div class="greybox">&nbsp;</div>
        </div>
      </div>
      <div class="four columns">
        <p>Yourself off its pleasant ecstatic now law. Ye their mirth seems of songs. Prospect out bed contempt separate. Her inquietude our shy yet sentiments collecting. Cottage fat beloved himself arrived old. Grave widow hours among him no you led. Power had these met least nor young. Yet match drift wrong his our. 
New had happen unable uneasy. Drawings can followed improved out sociable not. Earnestly so do instantly pretended. See general few civilly amiable pleased account carried. Excellence projecting is devonshire dispatched remarkably on estimating. Side in so life past. Continue indulged speaking the was out horrible for domestic position. Seeing rather her you not esteem men settle genius excuse. Deal say over you age from. Comparison new ham melancholy son themselves. 
Affronting everything discretion men now own did. Still round match we to. Frankness pronounce daughters remainder extensive has but. Happiness cordially one determine concluded fat. Plenty season beyond by hardly giving of. Consulted or acuteness dejection an smallness if. Outward general passage another as it. Very his are come man walk one next. Delighted prevailed supported too not remainder perpetual who furnished. </p>
      </div>
      <div class="four columns">
       <div class="row">
            <div class="greybox">&nbsp;</div>
        </div>
        <div class="row">
            <div class="greybox">&nbsp;</div>
        </div>
      </div>
    </div>
  </div>

自定义骨架响应式布局

Customizing Skeleton responsive layout

layout

responsive-design

skeleton-css-boilerplate