[分享]css划出省市县的代码

如果想要在网页上划出省市县，可以使用CSS的border属性来实现。下面是一个基本的实现方法：

/* 省份行样式 */
.province {
  border-bottom: 2px solid black;
  padding-bottom: 10px;
}

/* 市区行样式 */
.city {
  border-left: 2px solid black;
  border-right: 2px solid black;
  padding-left: 10px;
  padding-right: 10px;
}

/* 县区行样式 */
.county {
  border-left: 2px solid black;
  padding-left: 10px;
} 

在代码中，我们为省份、市区和县区三个层级分别设置了不同的边框属性。省份行的底部用2像素粗的黑色边框来做，市区行的左右两侧用2像素粗的黑色边框来做，县区行的左侧用2像素粗的黑色边框来做，这样就可以完美划出省市县了。

实现这种效果的前提是需要事先知道省市县三个层级的对应关系，以便在HTML代码中合理地设置CSS类名来分别显示出不同的行样式。我们可以使用如下的HTML代码和CSS样式来演示划出省市县的实现：

<div class="province">
  <p>福建省</p>
  <div class="city">
    <p>厦门市</p>
    <div class="county">
      <p>思明区</p>
    </div>
  </div>
</div> 

在HTML代码中，我们使用了三个<div>标签，分别代表省份、市区和县区三个层级，并设置了对应的CSS类名。这样，通过CSS样式的设置，我们就可以轻松划出省市县了。