Не удается добавить изображения на страницу входа

0

Во-первых, код страницы login.aspx:

<%@ Page Title="Log In" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Login.aspx.cs" Inherits="DoubleEntryForm.Account.Login" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
    &nbsp;Log In
</h2>
<%--<p>
    Please enter your username and password.
    <asp:HyperLink ID="RegisterHyperLink" runat="server" EnableViewState="false">Register</asp:HyperLink> if you don't have an account.
</p>--%>
<asp:Login ID="LoginUser" runat="server" EnableViewState="false" RenderOuterTable="false" DestinationPageUrl="~/Destruction Form.aspx">
    <LayoutTemplate>
        <span class="failureNotification">
            <asp:Literal ID="FailureText" runat="server"></asp:Literal>
        </span>
        <asp:ValidationSummary ID="LoginUserValidationSummary" runat="server" CssClass="failureNotification" 
             ValidationGroup="LoginUserValidationGroup"/>
        <div class="accountInfo">
            <fieldset class="login">
                <legend>Account Information</legend>
                <p>
                    <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">Username:</asp:Label>
                    <asp:TextBox ID="UserName" runat="server" CssClass="textEntry"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" 
                         CssClass="failureNotification" ErrorMessage="User Name is required." ToolTip="User Name is required." 
                         ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
                </p>
                <p>
                    <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password">Password:</asp:Label>
                    <asp:TextBox ID="Password" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" 
                         CssClass="failureNotification" ErrorMessage="Password is required." ToolTip="Password is required." 
                         ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
                </p>
                <p>
                    <asp:CheckBox ID="RememberMe" runat="server"/>
                    <asp:Label ID="RememberMeLabel" runat="server" AssociatedControlID="RememberMe" CssClass="inline">Keep me logged in</asp:Label>
                </p>
            </fieldset>
            <p class="submitButton">
                <asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="LoginUserValidationGroup"/>
            </p>
        </div>
    </LayoutTemplate>
</asp:Login>

На этой странице я пытаюсь добавить стиль CSS, и каждый путь, который я пытаюсь, не работает. Вот этот стиль:

<style type="text/css">

body{
    margin:0;
    padding:0;
    background-color:#eae9e9;}

#scan-table-wrapper {
    width: 968px;
    margin: 0 auto 0 auto;
    background-image: url("Images/wrapper-bg.png");}    

#scan-table-body{
    margin:0 30px 0 30px;
    padding-top:30px;}

.auto-style1 {
    width: 880px;
    height: 100px;}

</style>

Я также пытаюсь добавить изображение заголовка. Однако, если я поместил код в раздел HeaderContent, он выглядит так, как будто он пытается отобразить изображение заголовка и не удается, и вообще не отображает фон (путем отказа, я имею в виду, что пустой ящик появляется с небольшим красным X в этом). Если я поместил его в MainContent, в нем указано, что я не могу поместить стиль в div. Тем не менее, я не помещаю его в div, но я помещаю его в строку справа внизу, где начинается MainContent.

Это мой первый раз, сильно занимающийся CSS, поэтому я немного незнакомый. Где я должен помещать их так, чтобы они отображались на моей странице?

  • 0
    Очень важно помнить, где находится ваша таблица стилей относительно папки с изображениями, иначе пути к изображениям могут быть неверными.
Теги:
webforms

1 ответ

2
Лучший ответ

Действительно, ваш тег войдет в HeadContent, контент. Если вы видите изображение с красным крестом, это означает, что css работает нормально, но не может найти изображение в указанном вами каталоге. Просьба установить соответствующий путь, используя ../ что означает один каталог вверх.

Например, если ваша структура проекта

Root -> Images/wrapper-bg.png
     -> Pages/Your Aspx pages

и на вашей странице aspx у вас есть свой стиль, тогда вы должны использовать

background-image: url ('../Images/wrapper-bg.png');}//использовать одиночную кавычку

../выведет вас за пределы каталога страниц и разместит вас внутри корня, в случае выше, а затем Images/Wrapper-bg.png, и путь будет удовлетворен. Это все.

Для тела Bg

Переместите свой css в главный раздел главной страницы. Убедитесь, что не должно быть больше CSS для тела применяется либо из внешнего css, либо из встроенного css.

Хороший способ справиться с CSS

Добавьте таблицу стилей в свое название проекта style.css или что угодно. Перетащите файл css в раздел главной страницы главной страницы, он автоматически добавит ссылку. Теперь начните писать свой css в этом файле. Все дочерние страницы автоматически наследуют стиль из этого файла на основе ваших инструкций. Также вы можете использовать сторонний редактор CSS для упрощения написания css и обучения. Обычно я использую Rapid CSS.

Должен попробовать

Мой очень предпочтительный режим - это.Net с Jetbrains Resharper. Это действительно здорово!

  • 0
    даже после попытки этого я все еще не получаю фоновое изображение или изображение заголовка. CSS правильно применяется к странице, так как он изменил цвет фона. Это просто не применяет изображения должным образом.
  • 0
    @MichaelBowman может записать структуру каталогов вашего проекта
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню