Trang web ASP.NET - Bố cục trang


Với Trang Web, thật dễ dàng để tạo một trang web với bố cục nhất quán.


Một cái nhìn nhất quán

Trên Internet, bạn sẽ khám phá ra nhiều trang web với giao diện nhất quán:

  • Mọi trang đều có cùng một tiêu đề
  • Mọi trang đều có chân trang giống nhau
  • Mọi trang đều có cùng một kiểu dáng và bố cục

Với Trang Web, điều này có thể được thực hiện rất hiệu quả. Bạn có thể sử dụng lại các khối nội dung (khối nội dung), như đầu trang và chân trang, trong các tệp riêng biệt.

Bạn cũng có thể xác định bố cục nhất quán cho tất cả các trang của mình bằng cách sử dụng mẫu bố cục (tệp bố cục).


Khối nội dung

Nhiều trang web có nội dung được hiển thị trên mọi trang (như đầu trang và chân trang).

Với Trang Web, bạn có thể sử dụng phương thức @RenderPage () để nhập nội dung từ các tệp riêng biệt.

Khối nội dung (từ một tệp khác) có thể được nhập vào bất kỳ đâu trong trang web và có thể chứa văn bản, đánh dấu và mã, giống như bất kỳ trang web thông thường nào.

Sử dụng đầu trang và chân trang chung làm ví dụ, điều này giúp bạn tiết kiệm rất nhiều công việc. Bạn không phải viết cùng một nội dung trong mọi trang và khi bạn thay đổi tệp đầu trang hoặc chân trang, nội dung sẽ được cập nhật trong tất cả các trang của bạn.

Đây là cách nó trông trong mã:

Thí dụ

<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1>
<p>This is a paragraph</p>
@RenderPage("footer.cshtml")
</body>
</html>


Sử dụng trang bố cục

Trong phần trước, bạn đã thấy rằng việc đưa cùng một nội dung vào nhiều trang web rất dễ dàng.

Một cách tiếp cận khác để tạo giao diện nhất quán là sử dụng trang bố cục. Một trang bố cục chứa cấu trúc, nhưng không chứa nội dung của một trang web. Khi một trang web (trang nội dung) được liên kết với một trang bố cục, nó sẽ được hiển thị theo trang bố cục (mẫu).

Trang bố cục giống như một trang web bình thường, ngoại trừ lệnh gọi đến phương thức @RenderBody () nơi trang nội dung sẽ được đưa vào.

Mỗi trang nội dung phải bắt đầu bằng một chỉ thị Bố cục .

Đây là cách nó trông trong mã:

Trang bố cục:

<html>
<body>
<p>This is header text</p>
@RenderBody()
<p>&copy; 2014 W3Schools. All rights reserved.</p>
</body>
</html>

Bất kỳ Trang Web nào:

@{Layout="Layout.cshtml";}

<h1>Welcome to W3Schools</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laborisnisi ut aliquip ex ea commodo consequat.
</p>

KHÔ - Đừng lặp lại chính mình

Với hai công cụ ASP.NET, Khối nội dung và Trang bố cục, bạn có thể cung cấp cho các ứng dụng web của mình một giao diện nhất quán.

Những công cụ này cũng giúp bạn tiết kiệm rất nhiều công việc, vì bạn không phải lặp lại cùng một thông tin trên tất cả các trang. Tập trung đánh dấu, kiểu và mã giúp các ứng dụng web dễ quản lý hơn và dễ bảo trì hơn.


Ngăn không cho tệp được duyệt

Với ASP.NET, không thể duyệt các tệp có tên bắt đầu bằng dấu gạch dưới từ web.

Nếu bạn muốn ngăn người dùng xem các khối nội dung hoặc tệp bố cục của mình, hãy đổi tên tệp thành:

_header.cshtml

_footer.cshtml

_Layout.cshtml


Ẩn thông tin nhạy cảm

Với ASP.NET, cách phổ biến để ẩn thông tin nhạy cảm (mật khẩu cơ sở dữ liệu, mật khẩu email, v.v.) là giữ thông tin trong một tệp riêng có tên "_AppStart".

_AppStart.cshtml

@{
WebMail.SmtpServer = "mailserver.example.com";
WebMail.EnableSsl = true;
WebMail.UserName = "[email protected]";
WebMail.Password = "your-password";
WebMail.From = "[email protected]";
}