Как изменить тему и цвета Site.Master в ASP.NET / C #?

Question

Я только недавно запустил ASP .NET, я уже знаю C # HTML и CSS, так что запустить простой сайт было несложно.Все онлайновые учебные пособия и документация, которые я нашел, либо полностью визуальны с использованием дизайнеров vs2005 ~ 2010 (я ненавижу дизайнеров), либо в основном занимаются проектированием и некоторыми частями в VB .NET (я э ... не слишком увлечен VB .NET).В целом, большинство из них охватывает только основные и простые части веб-разработки, поэтому у меня возникают проблемы с освоением API.В любом случае, меня больше всего беспокоит то, что я не могу изменить внешний вид веб-элементов управления, свойства css работают в некоторых случаях, но не во всех.Часть Site.Master практически не изменилась.Снимок экрана:

снимок экрана

Как изменить синий и голубой цвета Site.Master?

Answer 1

Многие элементы, которые я искал, были в файле bootstrap.css.

Однако я изменил свой site.css, чтобы перезаписывать элементы этого стиля.

Я использую Visual Studio 2013 Professional.

Эта ссылка была полезной. http://forums.asp.net/t/2009287.aspx?Changing+bootstrap+css

site.css

.navbar-inverse { 
    background-color: #FFF; 
    }

.navbar-inverse li { 
    font-weight:bold;
    }

Answer 2

Судя по всему, вы используете базовый веб-сайт, который Visual Studio создает для вас при создании нового проекта.

Исходя из этого предположения, вам нужно искать файл Site.cssв папке /Content/.Внутри этого будут все стили, используемые для различных элементов сайта.

Я думаю, что области, которые вы хотите изменить, это #header, #header h1', # menucontainer , ul # menu`

Просто измените свойства background и color на нужный вам цвет.Также измените цвет border

Answer 3

Вы можете открыть site.master так же, как и любую другую HTML-страницу. В Visual Studio Designer вы можете сделать просмотр кода (HTML). Оказавшись там, вы можете вносить изменения в свою таблицу стилей / html (в данном случае ваш главный файл) в соответствии с любыми элементами, которые вам нужно изменить. Я предполагаю, что вы знаете htm / css, как вы указали в своем вопросе.

Еще один способ быстро проверить html-элементы - открыть страницу в safari / chrome / firefox / opera, щелкнуть правой кнопкой мыши по интересующему элементу и «проверить элемент». Он скажет вам, что вам нужно изменить.

Btw: <asp:menu конвертируется в div. Установите класс для этого элемента и добавьте его в таблицу стилей.

Answer 4

Site.Master.cs:

    protected void Page_Load(object sender, EventArgs e)
    {

        foreach (MenuItem m in NavigationMenu.Items)
        {
            if (m.NavigateUrl.ToString() == "~" + HttpContext.Current.Request.Url.LocalPath.ToString())
            {
                m.Selected = true;
            }
            else
            {
                m.Selected = false;
            }
        }

        this.DataBind();
    }

Site.css:

Помимо этих двух я удалил "div.селектор меню ul li a: hover, селектор «div.menu ul li a: посещения» и селектор «div.menu ul li a: active».

div.menu ul li a.selected
{
    background-color: #867F27;
    border: 1px #4e667d solid;
    color: #dde4ec;
    display: block;
    line-height: 1.35em;
    padding: 4px 20px;
    text-decoration: none;
    white-space: nowrap;
}

div.menu ul li a
{
    background-color: #7E5B33;
    border: 1px #4e667d solid;
    color: #dde4ec;
    display: block;
    line-height: 1.35em;
    padding: 4px 20px;
    text-decoration: none;
    white-space: nowrap;
}

Answer 5

Пожалуйста, прочитайте и изучите 1..

1. Тема и оболочка ASP.NET .
2. Пошаговое руководство. Настройка веб-сайта с использованием тем в Visual Studio
3. Как: применять темы ASP.NET
4. Как: отключить темы ASP.NET
5. Как: программно применять темы ASP.NET
6. Пошаговое руководство. Создание тем, выбираемых пользователем
7. Как: определить страницу ASP.NETТемы