Como você colocar um fundo gradiente em itens de menu do ASP.NET?

StackOverflow https://stackoverflow.com/questions/421570

Pergunta

O chefe quer menu da página principal para mais agradável olhar. I gerada meu arquivo gradiente com uma das ferramentas disponíveis na rede, não há problema nenhum ..

Eu tentei fazer uma classe CSS para cada item de menu, mas quando eu usar a diretiva background-image eo construtor estilo, eu recebo uma linha como: 

background-image: url('file:///C:/Documents and Settings/Username/My Documents/Visual Studio 2008/WebSites/ThisSite/Images/Gradient.png')

... quando o que eu deseja é 

background-image: url('~/Images/Gradient.png')

O primeiro url vai, é claro, só trabalho quando estou depuração na minha máquina local - implantar isso e eu estou metralhado. Tantos outros ASP.NET objetos trabalho com "~ /" para indicar o diretório de nível superior do site, mas meu arquivo css não gosta e eu não posso definir uma imagem de fundo para o controle de menu ou os itens de menu - parece ser uma omissão flagrante quando eu posso fazê-lo a tantos outros controles.

O que eu estou ausente?

Foi útil?

Solução

Você está quase lá ... tente o seguinte: 

.menuStyle
{
  background-image: url('/images/BG.gif'); /* Putting a slash in front means its relative to the root.  No slash would be relative to the current directory. */
  background-repeat: repeat-x; /* assuming you have a vertical gradient. */
}

Espero que ajude.

Outras dicas

O url em suas necessidades CSS para ser uma URL absoluta (ou parente) e não usar o mapeamento til, pois não é um componente do lado do servidor. 

    background-image: url(  "/images/menu.jpg" );

Não é uma omissão flagrante. Não é uma omissão em tudo. O til é uma construção de ASP. Em sua CSS não terá qualquer significado.

Um "substituir todos" operação e você está definido.

Substitua file: /// C:. / Documents and Settings / usuário / Meus Documentos / Visual Studio 2008 / sites / ThisSite com espaço em branco

Eu tentei definindo a propriedade background-image do CSS no meu aplicativo ASP.Net (ou seja, dando o caminho relativo conforme descrito no post). No entanto, ele não funcionou para mim. Mais tarde, definindo a imagem de fundo como background-image:url('http://localhost:1701/Images/BannerTileBackground.gif'); fez trabalho ..

Por favor, deixe-me saber o que é a abordagem correta, ea razão por que não funcionou antes.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top