آموزش Bootstrap > مقدمه آموزش Bootstrap
آموزش نصب Bootstrap در نرم افزار ویژوال استودیو و سایت های ASP.Net
مقدمه آموزش نصب Bootstrap در نرم افزار ویژوال استودیو و سایت های ASP.Net :
همانطور که در درس های قبل اشاره کردیم ، bootstrap مجموعه ای از کلاس ها و اسکریپت های آماده است که می توانید از آنها برای قالب دهی و طراحی عناصر صفحات خود استفاده نمایید .
در این درس ، شما را با نحوه اضافه کردن فایل ها و امکانات bootstrap به یک سایت ASP.Net در محیط ویژوال استودیو آشنا خواهیم کرد .
نرم افزار ویژوال استودیو ، دارای ابزار درون ساخته ای به نام Package Manager Console می باشد که به وسیله آن می توانید
پکیج ها و ابزارهای آماده را به پروژه یا وب سایت خود اضافه نمایید . این ابزار به صورت خودکار ، به منبع هر پکیج متصل شده و فایل ها ، پوشه ها و سایر محتویات
مربوط به هر پکیج را دانلود کرده و آن را درون پروژه یا سایت شما قرار می دهد .
نحوه دسترسی به ابزار Package Manager Console در نرم افزار ویژوال استودیو :
برای دسترسی به ابزار Package Manager Console ، از منوی Tools نرم افزار ویژوال استودیو ، همانطور که در تصویر زیر نشان داده شده است ، گزینه
NuGet Package Manager را باز نموده و آیتم Package Manager Console را انتخاب نمایید .
سپس پنجره این ابزار در محیط برنامه Visual Studio به صورت زیر باز می شود :
نکته مهم : برای استفاده از ابزار Package Manager Console و نصب پکیج های مورد نظرتان ، بایستی حتما به اینترنت متصل باشید .
نحوه نصب پکیج bootstrap توسط ابزار Package Manager Console :
برای نصب هر پکیج توسط ابزار Package Manager Console در ویژوال استودیو ، بایستی عبارت install-package و سپس نام پکیج مورد نظر را در خط فرمان تایپ نموده و دکمه Enter را بزنید .
برای نصب پکیج bootstrap نیز ، عبارت install-package bootstrap را همانند تصویر زیر ، در خط فرمان ابزار نوشته و دکمه Enter را بزنید .
سپس برنامه به صورت خودکار به منبع پکیج bootstrap متصل شده و فایل ها و سایر محتویات مربوط به آن را دانلود و به پروژه یا وب سایت شما اضافه می کند .
پس از نصب bootstrap ، پوشه های زیر ، همانطور که در تصویر نمایش داده شده است ، به وب سایت شما اضافه می شود :
- پوشه content : این پوشه شامل فایل های CSS که محتوی کلاس های آماده bootstrap می باشد ، است .
- پوشه fonts : این پوشه شامل font های مرتبط با bootstrap می باشد .
- پوشه scripts : این پوشه نیز شامل فایل های اسکریپت bootstrap و jQuery است که امکان استفاده از ویجت ها و ابزار های bootstrap را فراهم می کنند .
نحوه استفاده از کلاس های آماده bootstrap در صفحات طراحی شده ASP.Net :
پس از اینکه ، فایل های لازم برای به کارگیری bootstrap را در سایت ASP.Net خود دانلود کردید ، برای استفاده از کلاس های آن ، بایتسی در ابتدای هر صفحه
، لینک اتصال به فایل های CSS و یا اسکریپت های bootstrap را همانند کد زیر در بخش <head> صفحه قرار دهید . از آن پس ، کلاس ها و ابزار های bootstrap
به صورت نامحدود در صفحات ASP.Net یا HTML و ... در دسترس شما هستند :
<head>
&nbootstrapp;&nbootstrapp;&nbootstrapp;&nbootstrapp; <title>عنوان صفحه </title>
&nbootstrapp;&nbootstrapp;&nbootstrapp;
<link href="../../Content/bootstrap.css" rel="stylesheet" />
&nbootstrapp;&nbootstrapp;&nbootstrapp;&nbootstrapp; <link href="../../Content/bootstrap-theme.css" rel="stylesheet" />
&nbootstrapp;&nbootstrapp;&nbootstrapp;&nbootstrapp; <script src="../../Scripts/jquery-1.9.1.js"></script>
&nbootstrapp;&nbootstrapp;&nbootstrapp; &nbootstrapp;<script src="../../Scripts/bootstrap.js"></script>
</head>
|
راهنمایی : بنا بر نیاز و ضرورت استفاده می توانید لینک اتصال به هر یک از فایل های CSS و یا اسکریپت های فوق را اضافه و کم نمایید .
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1
حمایت نمایید :