div横向排列问 2022-07-15 80酷酷网 80kuku.com 以下是HTML网页特效代码,点击运行按钮可查看效果: 以下是程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><link href="css.css" rel="stylesheet" type="text/css" media="all" /></head><style type="text/css">charset "utf-8";/* CSS Document */body{ padding:0; margin:0; font-family:Arial, Helvetica, sans-serif; background:url(images/main_bg.gif) 0 0 repeat-x #fff; color:#5E5E5E;}div, h1, h2, h3, h4, p, form, label, input, textarea, img, span{ margin:0; padding:0;}ul{ margin:0; padding:0; list-style-type:none; font-size:0; line-height:0;}.spacer{ clear:both; font-size:0; line-height:0;}/*------------------------------------------------main--------------------*/#body{ width:918px; margin:0 auto;}/*------------------------------------------------top-------------------*/#top{ width:903px; height:23px; background:url(images/top_nav_bg.gif) 0 0 repeat-x; padding:8px 15px 0 0;}#top ul{ float:left; width:815px;}#top ul li{ float:left; font-size:0; line-height:0;}#top ul li a{ display:block; padding:0 14px; font:bold 11px/23px Arial, Helvetica, sans-serif; color:#6C6C6C; background-color:inherit; text-decoration:none;}#top ul li a:hover{ color:#fff; background-color:#BD0000;}#top ul li a.hover{ display:block; padding:0 14px; font:bold 11px/23px Arial, Helvetica, sans-serif; color:#fff; background-color:#BD0000; text-decoration:none; cursor:text;}#top p{ float:right; padding:2px 0 0 12px; background:url(images/phone_icon.gif) 0 2px no-repeat; font:bold 11px/16px Arial, Helvetica, sans-serif; color:#C89601; background-color:inherit;}/*------------------------------------------------top--------------------*/</style><body><div id="top"> <ul> <li><a href="#" class="hover">Home</a></li> <li><a href="#">About us</a></li> <li><a href="#">Support</a></li> <li><a href="#">Solutions </a></li> <li><a href="#">Targets</a></li> <li><a href="#">Signup</a></li> <li><a href="#">Meetings</a></li> <li><a href="#">News</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Contact</a></li> </ul> <p>+01-4445-6678</p> </div></body></html></font><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站,js.alixixi.com</a> [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]