如何在DW中创建ul和li并且使用

在网页设计中，li元素被广泛应用。无论是新闻列表还是网站导航，我们都可以看到li元素的身影。它还可以用作菜单。本文将简单介绍如何使用li元素。

创建ul和li

在Dreamweaver中创建ul和li非常简单。首先，在body标签中创建一个div，并给其添加class属性。然后在div中嵌套一个ul标签，在ul标签中嵌套多个li标签。

```

```

样式设置

我们可以给外部的div添加边框颜色、宽度和高度，以使li元素的变化更加明显。

```css

.myul {

width: 300px;

height: 300px;

border: 1px solid #000;

}

```

为了使li元素具有距离和颜色，我们可以给ul添加样式。

```css

.myul ul {

width: 300px;

height: 300px;

}

.myul ul li {

width: 300px;

height: 15%;

color: #FF0000;

font-family: "宋体";

font-size: 14px;

}

```

去除圆点并靠拢文本

为了去除li元素前的圆点，并使文本靠左对齐，我们可以给ul添加样式。

```css

.myul ul {

width: 290px;

height: 300px;

list-style: none;

padding-left: 10px;

}

```

横排排列

如果想让项目水平排列，就像是网站的栏目一样，我们可以调整li元素的宽度，并设置每个项目都向左浮动。

```css

.myul ul li {

width: 20%;

float: left;

text-align: center;

}

```

通过以上步骤，我们可以在DW中创建ul和li，并对其进行样式设置，使其在网页中应用得更加灵活和美观。

版权声明：本文内容由互联网用户自发贡献，本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。