Tìm hiếu kết cấu và sử dụng các Layout trong trang Razor Page với ASP.NET vi xử lý core C#, sử dụng View

Bạn đang xem: Cách dùng css trong asp.net

Startcshtml auto chèn vào các Razor Page cùng Layout lồng nhau


Trong phần này tò mò về tổ chức tạo bố cục tổng quan chung cho các trang Razor Page trong ASP.NET Core. Trong ứng dụng Web thường xuyên là có nhiều trang, mà các trang này có thể có phần đa thành phần giống nhau trên trang, như tương đương nhau phần header, footer, menu điều phối ... Bởi vậy, nhằm tránh mỗi trang lại phải tạo những thành phần này lại cho trang kia thì cần phải có cơ chế tạo một bố cục chung, những trang chia sẻ cùng tía cục. Đó là Layout trong ASP.NET Core.

Hay lập cập tạo ra một dự án công trình ASP.NET vi xử lý core Razor Pages nhằm thực hảnh, sinh sản thư mục razor02.layout, vào và gõ lệnh

dotnet new webapp nhìn vào cấu trúc thư mục sắp xếp các tệp tin .cshtml (Razor Page) trong folder Pages, thấy có những file mà lại tên bước đầu bằng _ đó là các file được phối hợp để tạo nên layout (bố cục) của những trang. Các file kia như:

_View
Start.cshtml _View
Imports.cshtml Shared/_Layout.cshtml Shared/_Validation
Scripts
Partial.cshtml

Ví trí các file này đề nghị thực hành bố trí các tệp tin này như vậy, bao gồm cả khi đổi thư mục gốc chứa các Razor Page ( Đổi thư mục Razor Page )


*

Trang bố cục chính _Layout.cshtml

File Shared/_Layout.cshtml là bố cục tổng quan chính (master) thực hiện bởi những trang. Mở file này ra nó có cấu trúc như sau:

Lúc này các trang Razor Page như thế nào chỉ định áp dụng Layout này thì ngôn từ của vày Razor Page đó ra đời được chèn vào ví trí:


Render
Body() ngoài ra nó cũng chèn section mang tên Script, trường hợp trang Razor sử dụng layout bao gồm định nghĩa Section này (Xem chỉ thị
Render
Section("Scripts", required: false) dữ liệu truyền trường đoản cú Razor Page quý phái Layout hoàn toàn có thể sử dụng đối tượng người tiêu dùng lớp View
Data
Dictionary có tên View
Data, trường phù hợp trên là đem tiêu đề chèn vào layout sinh hoạt dòng


View
Data<"Title"> - razor02.layout

Cấu hình Razor Page thực hiện _Layout.cshtml

lúc đã tất cả file layout chủ yếu Shared/_layout.cshtml làm thế nào để một Razor Page biết là cần phải sử dụng Layout này? Đơn giản, tại Razor Page cấu hình thiết lập cho nó trực thuộc tính Layout bởi tên layout mong muốn sử dụng (tên không buộc phải .cshtml), ví dụ:


Layout = "_Layout"; nếu bạn có một layout khác, lấy một ví dụ Shared/Theme/My
Theme/_My
Layout.cshtml (nhớ layout phải có dòng
Layout = "Theme/My
Theme/_My
Layout";Nếu muốn hủy thực hiện layout của một trang Razor thì gán Layout = null; ở cấu trúc trên

File _View
Start.cshtml

Trong cấu tạo thư mục Razor Page thấy bao gồm file _View
Start.cshtml,nếu có file này thì ASP.NET bộ vi xử lý core Razor thông số kỹ thuật được tự động chèn ngôn từ viết vào nó vào các file Razor Page.

Ví dụ, thay vì chưng mỗi trang Razor quan trọng lập layout sử dụng là _Layout.cshtml thì chúng ta viết cấu hình này trong file _View
Start.cshtml


Layout = "_Layout"; Từ phía trên trở đi, những Razor Page được tự động chèn câu chữ trên mọi khi nó được gọi.

Layout lồng nhau

Bạn hoàn toàn có thể tạo layout nhỏ nằm vào layout khác, hãy thực hành một trường hợp như sau:

Tạo ra một Layout gọi đặt thương hiệu là Mater
Layout trong thư mục /Shared/Product/_Mater
Layout.cshtml bao gồm nội dúng

Asp.net ver 4.5 up mình thấy có thông số kỹ thuật Bundle
Config. Đây là technology gói với load file .css với javascript của Microsoft. Mặc dù khi viết code giao diện, khó áp dụng vì tủ sách bị nén lại rồi không sử dụng nhắc(gợi ý code nữa)

Giải pháp lúc code là liên kết file bằng phương pháp kéo vào master page

Nếu là css thì không vụ việc dù trên thiết bị Dev hay đồ vật server lúc publish bắt buộc cũng không sự việc gì:

 ref=”~/Content/css/Admin
LTE.css” rel=”stylesheet” />

Lỗi sẽ lộ diện với tệp tin .js

/Content/js/site.js

http://Content/js/site.js


*

*

*

*

*

model
Application
Asp.net
Asp.net MVCasp.net webformasync
Asynchronousawait
Bootstrap
Bundle
Config
C#Caching
Cassandra
Chart
Check

Xem thêm: Giữ cho riêng anh biết - lời bài hát giữ riêng anh

List
Box
Clean Code
Combine datatableconvert giờ đồng hồ việtcookies
CQRSCSVCông cầm cố lập trình
Công nghệ
Công nghệ phần mềmdatatable
Design Pattern
DMLDocument Outline
Dropdownlist
English
Entity Frameworkepplus
FCK Editor vào .netflexcellformat datetime
Generator Code 3 layer
Github
Gridview
Hibernate
Hidden Fields
Import Excel
Io
TJava
Javascript
Learn
Linq
Machine Learning
MFCmultiple Submit
MVCMVC 5NET Core
No
SQLnuget
OOPOutput
Placeholder
Query
Strings
Rewrite URLSearch
Select Dropdown list trong asp.net core MVCsession
Session timeout
Skill
Software development life cycle
SQLSQL Advancethree layer
Tiếng Anh
Tool
Usercontrol
View
State
Visual Studio 2017

Mây siêng mục


.Net MVC 3 layer, three layer Asp.net Asp.net vi xử lý core Automotive Embedded Systems Bootstrap C# C# nâng cấp C++ Chrome Clean Code C plus and MFC phép tắc lập trình công nghệ phần mượt Design Pattern Entity Framework Excel HTML CSS Javascript Io
T Java Javascript Linq Machine Learning No
SQL Skill SQL giờ đồng hồ Anh Tổng vừa lòng XML Đọc báo