안녕하세요. 내 UL의 왼쪽 및 오른쪽 이미지를 삽입하려고합니다. Blueprint CSS 프레임 워크가 내 앱에 포함되어 있습니다. 아무도 내가 뭘 잘못하고 있는지 말해 줄 수 없습니까. 감사합니다CSS 사용 전후에

CSS 



body{ 
    margin:0; 
} 

#header { 
    height:150px; 
    background: url("../images/header_bg.png") repeat-x; 
    border-bottom: 1px solid #ccc; 
} 

#logo{ 
    height:100%; 
    width:40%; 
    float:left; 
} 

#top_nav{ 
    width:100%; 
    height:65px; 
} 

#navigation{ 
    height:100%; 
    width:55%; 
    float:right; 
    padding-right:50px; 
    text-align: right; 
} 

#navigation ul:BEFORE{ 
    background-image: url("../images/header_menu_left.png"); 
} 

#navigation ul:AFTER{ 
    background-image: url("../images/header_menu_right.png"); 
} 

#navigation li{ 
    list-style: none; 
    float:right; 
    background: url("../images/header_menu_bg.png"); 
    height:35px; 
    padding-top:10px; 
    padding-left:15px; 
    padding-right:10px; 
}

HTML은

내가 존재하는 이미지와 jsFiddle에서 사용 있다면, 그것은 특히 아무 잘못 표시되지 않습니다

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
    <link href="css/blueprint/screen.css" rel="stylesheet" type="text/css" media="print" /> 
    <link href="css/blueprint/print.css" rel="stylesheet" type="text/css" media="print"> 
    <link href="css/screen.css" rel="stylesheet" type="text/css"> 
    <!--[if IE]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection" /><![endif]--> 
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> 
    <title>Site Ismi | Page Title</title> 
</head> 
<body> 
<div class="container"> 
<!-- Header Div Start --> 
<div id="header" class="span-24 last"> 
    <div id="logo"></div> 
    <div id="navigation"> 
     <div id="top_nav"></div> 
     <div id="menu_nav"> 
      <ul> 
       <li class="first">Item 1</li> 
       <li>Item 2</li> 
       <li class="last">Item 3</li> 
      </ul> 
     </div> 
    </div> 
</div> 
<!-- Content Div Start --> 
<div id="content" class="span-24 last"> 
    Ruby Content Here 
</div> 
<!-- Footer Div Start --> 
<div class="footer"></div> 
</div> 
</body> 
</html>

출처

2011-01-28 Cem Baykam

귀하의 질문이 정확히 무엇인지 모르겠습니까? –

질문을 명확하게 작성하십시오. 어떤 일이 일어나기를 원하십니까? 실제로 일어나고있는 일, 어떻게 다릅니 까, 오류가 있습니까? 해결하기 위해 무엇을 시도 했습니까? –

, 그것은 목록 항목에 표시 :

http://jsfiddle.net/pZ9Xj/1/

이미지가 실제로 존재하는지 확인하십시오. 또한 before 및 : after를 지원하지 않는 Internet Explorer를 사용하지 않도록하십시오.

출처

2011-01-28 14:48:54

당신은 오히려이 원하는 :

#navigation ul:BEFORE{ 
    content: url("../images/header_menu_left.png"); 
}

this를 참조 예제 css :before content에 대한 구글!

출처

2011-07-31 02:06:44 Ardik

CSS 사용 전후에

HTML은

답변

관련 문제