web前端|html教程
新手求救，，DIV+CSS导航条制作！
web前端-html教程
大家好，小弟再做一个导航条，遇到如下问题
08影院视频网站最新源码,q5 ubuntu,tomcat7与8比较,网络爬虫 规则设置,php现在还适合学吗,商品内容seolzw
目标网站的网页导航是这样的：
一元夺宝商城源码,vscode输出html,ubuntu接收usb数据,tomcat响应中文,sqlite 连接查询,jquery 触屏 插件,好看的管理前端框架,有看头 爬虫,php mysql 库,Seo黑帽软件,织梦系统小游戏网站源码,易语言取当前网页源码,中英文asp网站模板下载,滚动数字抽奖页面,华众虚拟主机管理系统 多ip vps,网站模版程序lzw
我用DIV+CSS 布局过后，样式是这样的，从下图可以看出导航的文字间距明显比目标网站的大很多。
matlab车牌识别源码,vscode 测试插件,ubuntu如何安装软件,tomcat 映射,sqlite 关闭数据库,dreamweaver 3网页设计宝典,怎么用php连接数据库代码怎么写,服务器备案和域名备案,wordpress 爬虫插件,如何定制前端框架,爬虫的模式,php com,免费seo工具,springboot串流,dede页码标签,网站升级中html代码,wordpress 网页搜索排名,帝国cms 搜索模板更新,phpcms v9后台慢,asp 页面模板下载,企业数据库管理系统,tcp socket建立文件传输的程序lzw
如果把width调小一点却又放不下，如图
下面是HTML部分
home SPECIALS ALL PRODUCTS CONTACT US ABOUT BACK TO TUTORIAL
下面是CSS部分
body{ background:url(../images/body-bg.jpg) fixed}.maindiv{ width:1000px;height:1200px;margin:0 auto}.head{ width:1000px;height:210px;margin:25px auto 0px}.menu{ width:1000px;height:30px;background:#060;color:#FFF;text-align:left}.menu ul { width:1000px;height:30px;}.menu ul li{font-size:11px;line-height:35px;text-transform:uppercase;text-align:left;width:100px;font-weight:bolder;float:left;list-style:none;}
请问如何才能实现导航条像目标网站那样 ，请高手指点，非常感谢！！！！
回复讨论(解决方案)
.maindiv {width: 1000px;height: 1200px;margin: 0 auto}.head {width: 1000px;height: 210px;margin: 25px auto 0px}.menu {width: 1000px;height: 30px;background: #060;color: #FFF;text-align: left}.menu ul {width: 1000px;/*height: 30px;*/padding-left:0;overflow:hidden;}.menu ul li {font-size: 11px;line-height: 30px;text-transform: uppercase;text-align: left;/*width: 100px;*/font-weight: bolder;float: left;list-style: none;}.menu ul li a{text-decoration:none;color:#ffffff;padding: 10px 15px;}.homeSpecail{padding-left:0;background-color:#333333;}
homeSPECIALSALL PRODUCTSCONTACT USABOUTBACK TO TUTORIAL
这里的导航中的“选项”一般都是链接，所以你可以在html中将导航“选项”用a标签包起来，然后通过a标签的padding来控制“选项”之间的间距。
我也是菜鸟，共同探讨学习吧，呵呵。
从目标图片你应该可以看出
菜单的宽度不等
菜单的间距相同
那么证明 宽度是auto让内容来撑
间距？padding 和 margin都可以设置 但是padding是不会重合的 margin是会重叠的
从上图看出应该是采用padding 因为左面的间距比里面的间距小貌似是一半的样子
.maindiv {width: 1000px;height: 1200px;margin: 0 auto}.head {width: 1000px;height: 210px;margin: 25px auto 0px}.menu {width: 1000px;height: 30px;background: #060;color: #FFF;text-align: left}.menu ul {width: 1000px;/*height: 30px;*/padding-left:0;overflow:hidden;}.menu ul li {font-size: 11px;line-height: 30px;text-transform: uppercase;text-align: left;/*width: 100px;*/font-weight: bolder;float: left;list-style: none;}.menu ul li a{text-decoration:none;color:#ffffff;padding: 10px 15px;}.homeSpecail{padding-left:0;background-color:#333333;}
homeSPECIALSALL PRODUCTSCONTACT USABOUTBACK TO TUTORIAL
这里的导航中的“选项”一般都是链接，所以你可以在html中将导航“选项”用a标签包起来，然后通过a标签的padding来控制“选项”之间的间距。
我也是菜鸟，共同探讨学习吧，呵呵。
非常感谢楼上的大哥，问题已经解决，非常感谢
额，不谢不谢…
letter-spacing
