Bootstrap страница отзывчивого

-4

Я пытаюсь создать этот тип знака страницы в загрузчике http://v4-alpha.getbootstrap.com/examples/signin/Bootstrap страница отзывчивого

, но до этого я уже создать страницу, но это не самонастройки кода

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Mainpage.aspx.cs" Inherits="project.Mainpage" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>System</title> 

    <link href="Styles/login.css" rel="stylesheet" /> 
    <link href="Styles/main.css" rel="stylesheet" /> 

    <link href="Content/bootstrap.css" rel="stylesheet" /> 

    <!-- Google Web fonts --> 
    <link href='http://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800' rel='stylesheet' type='text/css'/> 
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,700italic,400,800,700,600' rel='stylesheet' type='text/css'/> 
</head> 
<body style="background-image:url(images/slide07.jpg);background-repeat:no-repeat"> 

     <img class="logo" alt="LOGO" src="images/logomain.png" /> 
    <br /><br /> 
    <form id="form1" runat="server" class="fordiv"> 
     <div id="box"> 

       <span> 
        <img src="images/none.png" id="avtar" /> 

       </span> 

      <div style="margin-left: 190px;margin-top: -170px";> 

       <span> 
       <asp:TextBox CssClass="textbx" ID="txt_us" runat="server" placeholder="Enter UserName"></asp:TextBox><br /><br /> 

       </span> 
       <span> 
       <asp:TextBox CssClass="textbx" ID="txt_pwd" runat="server" placeholder="Enter Password" TextMode="Password"></asp:TextBox><br /><br /> 

       </span> 
       <span> 
        <asp:Button ID="Button1" CssClass="button" runat="server" Text="LOGIN" OnClick="Button1_Click" /> 
       </span> 
      </div> 
     </div><br /><br /> 
     <asp:Label ID="Label1" CssClass="info" visible="false"  runat ="server" Text="" BorderColor="Black"></asp:Label> 
    </form> 
    <table class="table" style="border: medium groove #FFFFFF; width: 100%; margin-top: 200px; "> 
     <tr> 
      <td> 
       <img style="margin-left: 10px;" src="images/passd.jpg" /> 
      </td> 

      <td> 
       <img src="images/1.jpg" /> 
      </td> 
      <td> 

       <img src="images/2.jpg" /> 
      </td> 
      <td> 

       <img src="images/3.jpg" /> 
      </td> 
      <td> 
       <img src="images/4.jpg" /> 
      </td> 
     </tr> 

    </table> 

     <br /><br /><br /> 
</body> 
</html>

Теперь я пытаюсь создать самонастройки отзывчивым и я попробовал этот

<div class="container"> 
     <img class="logo" alt="LOGO" src="images/logomain.png" /><br /><br /> 
     <form class="form-signin" runat="server" > 
     <h2 class="form-signin-heading">Please sign in</h2><br /><br /> 
     <label for="inputEmail" class="sr-only">Email address</label> 
     <asp:TextBox CssClass="textbx" ID="txt_us" runat="server" placeholder="Enter UserName"></asp:TextBox><br /><br /> 
     <label for="inputPassword" class="sr-only">Password</label> 
      <asp:TextBox CssClass="textbx" ID="txt_pwd" runat="server" placeholder="Enter Password" TextMode="Password"></asp:TextBox> 
     <br /><br /> 
     <asp:Button ID="Button1" CssClass="button" runat="server" Text="LOGIN" OnClick="Button1_Click" /> 
     <asp:Label ID="Label1" CssClass="info" visible="false"  runat ="server" Text="" BorderColor="Black"></asp:Label> 
     </form> 

    </div>

, но это показывает, неудобный дисплей

любое решение?

источник

2016-11-08 cool user

why down 4? : O: O –

Ну, для гибкого дизайна вы должны использовать систему сетки бутстрапов. Думаю, вам стоит немного рассказать о гибком дизайне here и системе сетки бутстрапа here.

источник

2016-11-08 12:26:40 Kiogara

Существует также учебник по загрузке 3: http://www.w3schools.com/bootstrap/default.asp –

Bootstrap страница отзывчивого

ответ

Смежные вопросы