html如图这种样式怎么做出来，只有里面有边框（边框是虚线，1px）

按照图中的效果，可以判断出边框为虚线，且外圈没有边框。示例如下：

HTML代码：

<ul>

    <li>纸尿裤</li>

    <li>奶粉</li>

    <li>儿童羽绒服</li>

    <li>婴幼服饰</li>

    <li>洗护喂养</li>

    <li>车床寝居</li>

    <li>玩具文具</li>

    <li>妈咪专区</li>

    <li>男童装童鞋</li>

    <li>女童装童鞋</li>

</ul>

CSS代码：

ul, li{

    box-sizing: border-box

    padding: 0

    margin: 0

}

ul{

    width: 200px

    font-size: 0

}

li{

    font-size: 14px

    display: inline-block

    width: 50%

    height: 28px

    line-height: 28px

    text-align: center

    border-bottom: 1px dashed #ccc

}

li:nth-child(odd){

    border-right: 1px dashed #ccc

}

li:nth-child(n+9){

    border-bottom: none

}

浏览效果：

1、打开html开发工具，新建一个html代码页面。html中创建一个div标签，给这个标签添加文字和一个class为了后面方便控制div的样式：

2、接下来在style标签设置div的样式，在solid类中将边框样式设为实线边框，颜色这里用默认的黑色：

3、保存html代码使用浏览器打开，即可看到浏览器页面上显示一个实线边框。以上就是网页设计中设置边框的详细步骤：

您好，要突出div边框，可以使用CSS的border属性，例如：div {border: 1px solid #000}，其中1px代表边框的宽度，solid代表边框的样式，#000代表边框的颜色，您可以根据自己的需要调整这些属性。另外，您还可以使用CSS的outline属性来突出div边框，例如：div {outline: 1px solid #000}，其中1px代表边框的宽度，solid代表边框的样式，#000代表边框的颜色，您可以根据自己的需要调整这些属性。

---