扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
li{list-style:none}把默认的给去掉,然后把着了色的圆点切成一张背景图片使用。
创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于成都网站建设、成都网站设计、五通桥网络推广、小程序制作、五通桥网络营销、五通桥企业策划、五通桥品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联公司为所有大学生创业者提供五通桥建站搭建服务,24小时服务热线:18982081108,官方网址:www.cdcxhl.com
1.li自身圆点的颜色是修改不了的,你不想要那个圆点的话,可以通过以下几种方式来解决,.将圆点去掉,li{ list-style:none},然后用color:#ff0000;设置字体的颜色,li./li这里的点就是红色的了。
2.你可以设置为自己喜欢的颜色,如果你要区分点和字的颜色,可以在li里面再嵌入一个标签,像这样:li style="color:#ff0000; font-size。
3.12px;"span style="color:#00ff00; font-size:20px;"./spanlist1/li这样点就是绿色的,字就是红色的了。
4.将圆点去掉,li{ list-style:none};然后将那个点做成图片,然后嵌入li中。:li style="color:#ff0000; font-size:12pximg src="图片地址"list1/li。
首先网页的结构还是html搞定的,而网页中各部分的样式(是红的是绿的,是大的是小)是由css决定的。
而div,只是一组标签div/div,制作网页时可以用它来选中html中的某个部分,为他命名,从而让css为这个部分添加样式。
说的比较白话,希望能听得懂..
用photoshop制作psn文件,只不过是在用代码设计网页的初期,先做出一个草图,便于定位和切图。
对于css,lz应该多看看这方面的书。另外,css+div只是一种运用css的方法,“div+css模板”这种东西是不存在的。
居中:text-align:center;( 而默认就是左对齐的),
再设置:text-align:left;
代码如下:
.box{text-align:center;text-align:left}
ul class=“box”
li内容1/li
li内容2/li
li内容3/li
/ul
把ul放在一个div里,设置div的宽度等于4倍单个li,设置li的float属性为left。这样就可以了。不知道你明白了么?
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
""
html xmlns="" lang="zh-CN"
head
title鼠标移动显示/title
meta http-equiv="Content-Type" content="text/html;charset=utf-8"/
meta name="description" content=""/
script type="text/javascript" src="js/jquery-1.8.0.js"/script
style type="text/css"
ul,li{
margin:0px;
padding:0px;
list-style: none;
}
ul{
height:31px;
border-bottom:1px solid #f46d52;
}
li{
width:100px;
height:30px;
border-radius:5px 5px 0px 0px;
border:1px solid #ccc;
border-bottom:none;
text-align: center;
line-height: 30px;
background-color:#EEEEEE;
float: left;
color:black;
font-weight: 800;
margin-left:5px;
}
li:hover{
height:31px;
background-color: white;
color:#FDE7D2;
border:1px solid #f46d52;
border-bottom:none;
cursor:pointer;
}
/style
/head
body
div class="nav"
ul
li导航1/li
li导航2/li
li导航3/li
/ul
/div
/body
/html
效果图:
这个只是简单的.hover事件,如果要点击得到效果那个需要写js。。。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流