首页 > 软件开发 > ASP >

vs2013 ASP.NET Web Form + Bootstrap 套件

来源:互联网 2023-03-16 19:06:53 544

要弄啥网页的,然后要用到bootstrap这样东西,一开始以为bootstrap就当软件用的,然后被告知是工具集。然后我看来就是属于文档类。最后在高手的文章中提到的是套件。qKV办公区 - 实用经验教程分享!

2015-09-11我个人的理解,就是一些被赋予颜色,字体等属性集合的class或id,我们如果用那些,可以减少自己颜色调整字体调整框架调整。但是首先还要了解他里面是怎么命名的。感觉如果是熟悉的人,自己写的灵活性会比较大。可以把自己写的style,javascript等等像他一样打包起来。html的页面就不会显得冗长等特点PS:相对路径绝对路径http://www.cnblogs.com/heyonggang/archive/2013/03/01/2938984.htmlqKV办公区 - 实用经验教程分享!

工具/原料

  • Visual Studio Community 2013 英语版

方法/步骤

  • 1

    File->qKV办公区 - 实用经验教程分享!

    New->qKV办公区 - 实用经验教程分享!

    Project…qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 2

    ▲webqKV办公区 - 实用经验教程分享!

    Visual Studio 2012->qKV办公区 - 实用经验教程分享!

    ASP.NET Empty Web Application->qKV办公区 - 实用经验教程分享!

    okqKV办公区 - 实用经验教程分享!

    (PS:可以自己改名字,也可以browse自己改放在其他地方)qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 3

    TOOLS->qKV办公区 - 实用经验教程分享!

    NuGet Package Manager ->qKV办公区 - 实用经验教程分享!

    Manage NuGet Packages for Solution…qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 4

    右上角 键盘输入bootstrap->qKV办公区 - 实用经验教程分享!

    按那个搜索qKV办公区 - 实用经验教程分享!

    获得 Bootstrap CSS ,点击InstallqKV办公区 - 实用经验教程分享!

    载入完毕会有对话框qKV办公区 - 实用经验教程分享!

    然后确定要载到刚刚那个创建好的的web名下的即可qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 4该信息未经授权抓取自百度经验
  • 5

    成果(如果没有这个Solution Explorer,那么点击VIEW->Solution Explorer 就会出现了,话说我这里的成果和参考资料的文件分层有些许不同,但重点一样啦)qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 方法/步骤2

  • 1

    后面两者引号里面的就是用的bootstrap里面的css定义的颜色、字体等的值名class=“”name=“”qKV办公区 - 实用经验教程分享!

    qKV办公区 - 实用经验教程分享!

    代码qKV办公区 - 实用经验教程分享!

    %@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>qKV办公区 - 实用经验教程分享!

    qKV办公区 - 实用经验教程分享!

    !DOCTYPE html>qKV办公区 - 实用经验教程分享!

    html xmlns="http://www.w3.org/1999/xhtml">qKV办公区 - 实用经验教程分享!

    head runat="server">qKV办公区 - 实用经验教程分享!

    meta http-equiv="content-type" content="text/html;charset=utf-8"/>qKV办公区 - 实用经验教程分享!

    meta name="viewport" content="width=device-width, initial-scale=1.0"/>qKV办公区 - 实用经验教程分享!

    meta name="keywords" content=""/>qKV办公区 - 实用经验教程分享!

    link rel="stylesheet" href="/Content/bootstrap-theme.css"/>qKV办公区 - 实用经验教程分享!

    link rel="stylesheet" href="/Content/bootstrap.css"/>qKV办公区 - 实用经验教程分享!

    title>招聘/title>qKV办公区 - 实用经验教程分享!

    /head>qKV办公区 - 实用经验教程分享!

    body>qKV办公区 - 实用经验教程分享!

    form id="form1" runat="server">qKV办公区 - 实用经验教程分享!

    div class="navbar-inverse">qKV办公区 - 实用经验教程分享!

    div class="well-lg">qKV办公区 - 实用经验教程分享!

    h3 >泉州/h3>qKV办公区 - 实用经验教程分享!

    /div>qKV办公区 - 实用经验教程分享!

    ul class="navbar-nav">qKV办公区 - 实用经验教程分享!

    /ul>qKV办公区 - 实用经验教程分享!

    span>/span>qKV办公区 - 实用经验教程分享!

    /div> !-- jQuery (necessary for Bootstrap's JavaScript plugins) -->qKV办公区 - 实用经验教程分享!

    script src="/Scripts/jquery-1.9.1.js">/script>qKV办公区 - 实用经验教程分享!

    !-- Include all compiled plugins (below), or include individual files as needed -->qKV办公区 - 实用经验教程分享!

    script src="/Scripts/bootstrap.js">/script>qKV办公区 - 实用经验教程分享!

    /form>qKV办公区 - 实用经验教程分享!

    /body>qKV办公区 - 实用经验教程分享!

    /html>qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 2

    附带举例另一种路径qKV办公区 - 实用经验教程分享!

    link rel="stylesheet" type="text/css"qKV办公区 - 实用经验教程分享!

    href="bootstrap-3.3.5-dist/css/bootstrap-theme.css"/>qKV办公区 - 实用经验教程分享!

    link rel="stylesheet" type="text/css"qKV办公区 - 实用经验教程分享!

    href="bootstrap-3.3.5-dist/css/bootstrap.css"/>qKV办公区 - 实用经验教程分享!

    vs2013 ASP.NET Web Form   Bootstrap 套件qKV办公区 - 实用经验教程分享!

  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!qKV办公区 - 实用经验教程分享!


    标签: asp

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码