li的浮動問題
item也就是li的浮動沒有效果啊?什么原因呢
.index-banner{ ????position:?relative; ????background:?#3b3b3b; } .index-banner-bg{ ????height:?570px; ????overflow:?hidden; } .index-banner-bg?img{ ????margin:0?auto; } .index-banner-txt{ ????position:?absolute; ????top:?200px; ????left:?50%; ????margin-left:?-338px; } .index-banner-txt?.txt-logo{ ????width:776px; ????height:117px; ????background:?url(../images/txt-logo.png); } .index-banner-txt?.txt-info{ ????margin-top:?17px; ????text-align:?center; ????color:?#fff; } .index-banner-txt?.txt-info??.line{ ????display:?inline; ????width:?40px; ????border-top:?1px?solid?#fff; ????vertical-align:?middle; } .index-banner-txt?.txt-info?.txt{ ????margin:0?26px; } .index-menu{ ????position:?relative; ????border-top:4px?solid?#f34949; } .index-menu?.menu-tips{ ????position:?absolute; ????left:50%; ????top:0; ????margin-left:?-78px; ????width:?156px; ????height:75px; ????text-align:?center; ????line-height:65px; ????color:?#fff; ????background:#f34949?; } .index-menu?.menu-tips:after{ ????position:?absolute; ????content:?""; ????left:?0; ????bottom:0; ????width:0; ????height:0; ????border-left:?78px?solid?transparent; ????border-right:?78px?solid?transparent; ????border-bottom:?10px?solid?#fff; } .index-menu?.menu-list{ ????margin-top:?150px; ????color:?#555; ????overflow:?hidden; } .index-menu?.menu-list?ul{ ????width:1160px; } .index-menu?.menu-item{ ????float:?left; ????width:520px; ????margin-right:?60px; ????margin-bottom:?56px; } .index-menu?.menu-item?.title,?.index-menu?.menu-item?.line{ ????float:?left; } .index-menu?.menu-item?.price{ ????float:?right; } .index-menu?.menu-item?.title{ ????width:?230px; ????overflow:?hidden; ????white-space:?nowrap; ????text-overflow:ellipsis?; } .index-menu?.menu-item?.common{ ????margin-top:?4px; ????color:?#b7b7b7; ????font-size:?12px; } .index-menu?.menu-item?.line{ ????margin-top:?10px; ????width:?192px; ????border-top:?1px?solid?#e3e1e1; }
<!DOCTYPE?html> <html?lang="en"> <head> ???<meta?charset="UTF-8"> ???<title>Document</title> ???<link?rel="stylesheet"?href="css/index.css"> ???<link?rel="stylesheet"?href="css/cor.css"> ???<link?rel="stylesheet"?href="css/reset.css"> </head> <body> ???<div?class="public-header"> ??????<div?class="public-container?clearfloat"> ?????????<div?class="header-logo"><a?href=""></a></div> ?????????<ul?class="header-nav?clearfloat"> ????????????<li?class="item"><a?href="">OurStory</a></li> ????????????<li?class="item"><a?href="">Menu</a></li> ????????????<li?class="item"><a?href="">Reservations</a></li> ????????????<li?class="item"><a?href="">News</a></li> ????????????<li?class="item"><a?href="">Rviews</a></li> ?????????</ul> ??????</div> ???</div> ???<div?class="index-banner"> ??????<div?class="index-banner-bg"><img?src="images/demo1.jpg"?alt="banner"></div> ??????<div?class="index-banner-txt"> ?????????<div?class="txt-logo"></div> ?????????<p?class="txt-info"> ????????????<i?class="line"></i> ????????????<span?class="txt">resto?restaurant?home?page?website?template</span> ????????????<i?class="line"></i> ?????????</p> ??????</div> ???</div> ???<div?class="index-menu"> ??????<div?class="menu-tips">The?menu</div> ??????<div?class="public-container?menu-list"> ?????????<ul?class="clearfloat"> ????????????<li?class="menu-item?clearfloat"> ???????????????<div?class="title"> ??????????????????<a?href=""> ??????????????????<h4>voluptate?cillum?fugiat</h4> ??????????????????<p?class="common">Cheese,tomato,mushrooms,onions.</p> ???????????????</a> ???????????????</div> ???????????????<div?class="line"></div> ???????????????<div?class="price">$50</div> ????????????</li> ?????????</ul>
2016-07-01
名字寫錯了,你是不是想設(shè)置mune-item,item這個類沒有看到你設(shè)置樣式。
2018-04-27
你好,我也困在這里了,? 你找到原因了沒