Hướng dẫn how do i split a page into two parts in html? - làm cách nào để chia một trang thành hai phần trong html?

---

Tìm hiểu cách tạo màn hình chia (50/50) với CSS.

Nội dung chính Show

• Cách tạo màn hình chia
• Hướng dẫn từng bước về cách chia trang HTML thành hai phần theo chiều dọc:-
• Sự kết luận :-
• Làm thế nào để bạn chia một trang web trong HTML?
• Làm thế nào để bạn chia các phần trong HTML?
• Bạn có thể có 2 phần trong HTML không?
• Làm cách nào để chia một trang theo chiều ngang và chiều dọc trong HTML?

---

Hãy tự mình thử »

---

Cách tạo màn hình chia

Bước 1) Thêm HTML:

Thí dụ

& nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; Jane Flex & nbsp; & nbsp; & nbsp; Một số văn bản. & Nbsp;
 

   

   

Jane Flex

   

Some text.

 

& nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; John Doe & nbsp; & nbsp; & nbsp; Một số văn bản ở đây quá. & Nbsp;
 

   

   

John Doe

   

Some text here too.

 

Bước 2) Thêm CSS:

Thí dụ

& nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; Jane Flex & nbsp; & nbsp; & nbsp; Một số văn bản. & Nbsp;
.split {
  height: 100%;
  width: 50%;
  position: fixed;
  z-index: 1;
  top: 0;
  overflow-x: hidden;
  padding-top: 20px;
}

& nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; John Doe & nbsp; & nbsp; & nbsp; Một số văn bản ở đây quá. & Nbsp;
.left {
  left: 0;
  background-color: #111;
}

Bước 2) Thêm CSS:
.right {
  right: 0;
  background-color: red;
}

/ * Chia màn hình trong một nửa */. Split {& nbsp; Chiều cao: 100%; & nbsp; chiều rộng: 50%; & nbsp; Vị trí: Đã sửa; & nbsp; Z-index: 1; & nbsp; Top: 0; & nbsp; Overflow-x: ẩn; & nbsp; Padding-Top: 20px;}
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

/ * Kiểm soát phía bên trái */. Trái {& nbsp; trái: 0; & nbsp; màu nền: #111;}
.centered img {
  width: 150px;
  border-radius: 50%;
}

Hãy tự mình thử »

Cập nhật lần cuối: 24 tháng 3 năm 2022

Trong - HTML

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn giải pháp về cách chia trang HTML thành hai phần theo chiều dọc, tất cả chúng tôi đều biết rằng chúng tôi có thể chia trang HTML thành hai phần dọc cũng như hai phần theo chiều ngang.

Nhưng ngày nay, khái niệm của chúng tôi là giải quyết vấn đề phân chia trang HTML thành hai phần theo chiều dọc. Điều này có thể được thực hiện theo nhiều phương pháp khác nhau, nhưng mục tiêu của chúng tôi là giúp bạn giải quyết vấn đề theo cách dễ nhất.

Vì vậy, hôm nay chúng tôi sẽ cho bạn thấy rằng cách chúng tôi có thể chia trang HTML thành hai phần theo chiều dọc.

Hướng dẫn từng bước về cách chia trang HTML thành hai phần theo chiều dọc:-

Như, không lãng phí nhiều thời gian hơn. Điều này có thể được thực hiện với sự trợ giúp của các thẻ phân chia và thẻ con của nó được đặt tên là thẻ phần. Nhưng chủ yếu là thẻ phân chia được sử dụng cho công việc này.

Vì vậy, hãy chuyên nghiệp, chúng tôi cũng dạy bạn cách chia trang HTML theo chiều dọc bằng cách sử dụng các thẻ phân chia. Ngoài ra còn có một thuộc tính được sử dụng trong các mã có tên là Float và giá trị của nó còn lại.

Điều đó có nghĩa là nó nổi trang còn lại để chúng thẳng hàng theo chiều dọc. Bây giờ, mã được đưa ra như: