2012-10-29 7 views
3

Visual Studio 2010의 궁극적 인 asp.net에서 트위터 부트 스트랩을 사용하려고합니다. 나는 그것을 설정하는 방법과 이유를 설명하는 것을 찾을 수 없다. 내가 시도하는 모든 것이 제대로 작동하지 않습니다. 대부분의 기사는 MVC 용이며 여전히 asp.net에 익숙하지 않으므로 mvc를 시도하기 전에 기본으로 시작하겠습니다.twitter 부트 스트랩에 대한 기본 asp.net 설정

내가 가진 가장 가까운 스타일은 작동하도록하는 것이지만, 자바 스크립트는 어떤 예제를 사용해도 작동하지 않는 것 같습니다. 여기 내가 가진 가장 가까운 곳이야. 부트 스트랩 웹 사이트의 모달 예제 스 니펫과 mvc를 사용하여 부트 스트랩을 사용하는 몇 가지 블로그를 매시 업합니다.

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


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
    <title></title> 
    <link rel="stylesheet" href="~/css/bootstrap.min.css" /> 
    <link rel="stylesheet" href="~/css/bootstrap-responsive.min.css" /> 


</head> 
<body> 
    <script type="text/javascript" src="~/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="~/js/jquery-1.8.2.min.js"></script> 
    <form id="form1" runat="server"> 

     <a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

     <div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
      <h3 id="myModalLabel">Modal header</h3> 
      </div> 
      <div class="modal-body"> 
      <p>One fine body…</p> 
      </div> 
      <div class="modal-footer"> 
      <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
      <button class="btn btn-primary">Save changes</button> 
      </div> 
      @RenderBody() 
     </div> 
    </form> 
</body> 
</html> 

파일은 모두 링크 위치에 있습니다. 나는 일부 전제 조건이나 뭔가를 설치해야한다고 생각하기 시작했습니다. @RenderBody()는 텍스트로 표시됩니다.

나는 어떤 예제를 찾을 수 없습니다. 동그라미로 돌아 가기 시작한 ive가 큰 도움이 될 것입니다.

+1

MVC를 대신 사용하는 것이 좋습니다. 나는 당신이 기본을 배우고 싶다고 말하지만 그것이 asp.net이 MVC의 더 단순한 버전이라는 오해이다. 그들은 완전히 다릅니다. MVC가 좀 더 어려울 수도 있지만, asp.net을 배우면서 얻은 지식은 MVC로 이동할 때 거의 도움이되지 않습니다. Microsoft는 asp.net 웹 폼을 사용하는 사람들이 그렇게 느낄 수 없도록하기를 원하지 않지만 MVC는 asp.net 웹 폼을 대체합니다. – Phil

+0

안녕하세요. 조언을 주셔서 감사합니다. 나는 궁극적으로 나의 기술을 최신으로 가져오고 mvc를 배우는 것이 어리석은 일이 될 것이라고 생각하면서 mvc를 배우는 것을 매우 의도합니다. 나는 이미 asp.net에 대한 지식을 가지고 있으며, 나를 빨리 익힐 수있을 것이다. 거기에서뿐만 아니라뿐만 아니라 (다시 몇 가지 경험을 가지고) wpf로 진행 winforms에서 서버 측 소프트웨어와 같은 일을 mvc를 배우려고합니다. mvc가 webforms를 대체하고 있지만, 아직까지는 일어나지 않았습니다. 거의 모든 고용주는 두 가지 모두를 기대합니다. (단지 지금 웹 양식에 실패했습니다.) 모든 webforms advice는 많은 도움이 될 것입니다. – Paul

+0

NuGET 패키지 관리자를 사용하면 BootStrap MVC 응용 프로그램이 있습니다. 그곳에는 레이아웃 등을 시작하는 데 도움이되어야합니다. – kolin

답변

3

이것은 asp.net에서 문제가 아니므로 부트 스트랩 포함하기 전에 jquery JS 파일을 이동하기 만하면됩니다.

크롬과 같은 자바 스크립트 콘솔에서 브라우저를 사용하면 문제가 무엇인지 정확히 알 수있는 것은 아니지만 범위가 좁아지는 데 도움이됩니다.

+1

동의하고, 스크립트를 머리에 가져오고, 무엇보다도 먼저 jquery를로드하십시오. – kolin

+0

@kolin 자바 스크립트가 항상 머리 속에 가장 잘 배치되는 것은 아닙니다. (http://stackoverflow.com/questions/2451417/whats-pros-and-cons-putting-javascript-in-head-and-putting-just-before-the-body). 그러나 모범 사례는 HTML 또는 머리의 맨 아래에 있어야하지만 위와 같이 머리 바깥에 있지 않아야한다고 말합니다. – gezpage

+0

안녕하세요, Gez와 모두 감사합니다. 자바 스크립트의 순서를 변경하면 효과가 있습니다. 디버그 콘솔은 초보자에게도 유용한 팁입니다. 다시 한 번 감사드립니다. Paul – Paul

관련 문제