网页设计

dreamweaver中cs6项目列表符号样式设置

时间:2024-06-23 21:03:45 网页设计 我要投稿
  • 相关推荐

dreamweaver中cs6项目列表符号样式设置

  dreamweaver cs6中ul和li是有序和无序项目列表,它们也有自己的样式,在不同的情况下配合不同的符号样式会使设计出的网页更加的美观漂亮,在默认的情况下,项目列表前的符号是实心小圆点,这样很不美观,我们可以设置将其格式化或者换成其他样式,下面为大家提供了具体的代码和操作方法。

  dreamweaver cs6设置ul/li项目列表符号代码:

  LI代码的格式化:

  A).运用CSS格式化列表符:

  ul li{

  list-style-type:none;

  }

  例如下面的:

  供求信息

  B).如果你想将列表符换成图像,则:

  ul li{

  list-style-type:none;

  list-style-image: url(images/icon.gif);

  }

  例如下面的:

  供求信息

  C).为了左对齐,可以用如下代码:

  ul{

  list-style-type:none;

  margin:0px;

  }

  例如下面的:

  供求信息

  D).如果想给列表加背景色,可以用如下代码:

  ul{

  list-style-type: none;

  margin:0px;

  }

  ul li{

  background:#CCC;

  }

  例如下面的:

  供求信息

  E).如果想给列表加MOUSEOVER背景变色效果,可以用如下代码:

  ul{ list-style-type: none; margin:0px; }

  ul li a{ display:block; width: 100%; background:#ccc; }

  ul li a:hover{ background:#999; }

  说明:display:block;这一行必须要加的,这样才能块状显示!

  例如下面的:

  供求信息

  F).LI中的元素水平排列,关键FLOAT:LEFT:

  ul{

  list-style-type:none;

  width:100%;

  }

  ul li{

  width:80px;

  float:left;

  }

  dreamweaver cs6设置ul/li项目列表符号步骤

  首先我们打开Dreamweaver CS6软件。

  然后新建一个html文档,添加项目列表代码,并保存到合适的位置。

  在浏览器中预览会看到默认有黑色的圆点。

  去掉这些圆点其实很简单,只要把li标签的list-style-type:none;设置成这样就可以了。

  可以写成行内样式,但是比较繁琐,我们可以单独写在li的样式中。

【dreamweaver中cs6项目列表符号样式设置】相关文章:

Dreamweaver中CS6表格间距怎么设置09-22

在Dreamweaver中利用CSS样式表设置网页10-24

dreamweaver知识:CSS样式表设置网页07-07

DreamWeaver中应用CSS样式表10-07

DreamWeaver中CSS样式表应用技巧10-03

在DreamWeaver中应用CSS样式表技巧07-25

Dreamweaver应用CSS样式09-25

Dreamweaver如何创建滚动列表07-31

Dreamweaver中vm文件如何设置高亮显示08-25

Dreamweaver 8中表格属性的设置介绍10-13