在制作网站的侧边栏的时候，有时候会遇到整个侧边栏用实线，但内部的每个逻辑区用虚线的情况，如下图所示：
侧边栏的制作技巧是主标题是<h3>产品分类</h3>，手机通讯逻辑分区使用：副标题<h4>手机通讯</h4>，小选项使用ul，li来分类:
若是分为两栏的话，li的width设为50%，如下图所示：
若是一栏的话，li的width就设为width：auto。
上面所说的是边栏的只做技巧。下面谈谈中间的虚线小技巧：中间用虚线，边框都是实线，这里有一个小技巧，就是内部的逻辑分区，即class为products的margin-bottom设置为：
这样的话，边框底部虚线就和实线重合，但每个products的逻辑区底部还是虚线。