html制作网站中如何把内容页分成网格

用bootstrap可以很容易的实现：

<div class="row">

    <div class="col">1</div>

    <div class="col">2</div>

    <div class="col">3</div>

    <div class="col">4</div>

</div>

row 是行，col是列，

或者也可以用表格就能实现：

<table>

    <tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>

</table>

tr是行，td是列

推荐还是用bootstrap，这里有bootstrap的手删下载：

网页链接

希望能帮助到你，祝你生活愉快！

响应式网页其实并不难，一般ui设计师会交给你两套设计稿，一套是pc端的，一套是移动端的（平板电脑一般也算pc端），那么除了写两套代码之外（一般是两种端的界面差别比较大的才需要写两套）就是写自适应了，首先布局就是使用百分百，根据屏幕来适应大小。然后排行布局使用栅格系统。或者使用媒体查询，当然有时候需要两者一起用。然后单位使用rem,

至于rem其实就是根据根元素的大小来设置大小，不受父级大小影响。默认情况1rem = 16px

可以使用多种布局方法。

1. 使用rem单位，窗口改变时，js修改顶层像素尺寸。

2. js整体缩放窗口，动态改变transform的scale值。

3. 使用css媒体查询，动态更改字体大小，配合grid、table或flex布局。

4. js动态更改meta的设备缩放值。

5. 使用百分比单位，按照窗口百分比缩放。

6. js动态改变所有尺寸单位。

完美的方案都需要js配合。

---