Bài học về HTML. sáp nhập các tế bào

Các bảng trong HTML - một item rất tiện dụng. Với chúng, bạn có thể làm bất cứ điều gì. Tất nhiên, mục đích chính - đặt thông tin trong một bảng. Nhưng các nhà phát triển của các trang web còn đi xa hơn. Tại một thời gian nó đã rất phổ biến để sử dụng một bảng để tạo ra một khuôn khổ trang web. Bây giờ các chuyên gia đang cố gắng không làm như vậy.

Bàn đã tìm thấy ứng dụng rộng rãi của họ, vì số lượng lớn các thuộc tính. Ví dụ, một tài sản rất hữu ích quay kết hợp hàng hoặc cột.

Giới thiệu về Lý thuyết

Trong HTML, sự kết hợp của các tế bào xảy ra bằng các phương tiện của hai thuộc tính: colspan và rowspan. Họ được chỉ định cho các thẻ td.

Hãy để chúng tôi đầu tiên phân tích cấu trúc của mỗi bảng, trước khi chúng ta đi sâu vào chủ đề này. Trong mỗi bảng có một dòng, và trong nó - tế bào. Nên nhớ rằng ban đầu, tất cả các bảng phải chứa cùng một số tế bào.

Những con số trên cho thấy hai hàng và mỗi người trong số ba loại tế bào. Nó là một bảng thông thường. Nếu bạn đang ở trong bất kỳ hộp, gõ một số lượng nhỏ của các tế bào, bảng được "di chuyển ra khỏi", tất cả sẽ không được hiển thị một cách chính xác.

HTML-Table: sáp nhập các tế bào theo chiều dọc và chiều ngang

Để xác định một số lượng nhỏ các tế bào hoặc các chuỗi có thể được sử dụng chỉ khi bạn có một cái gì đó để sáp nhập. Nhưng thay vì mục bị xóa trong những người hàng xóm gần đầu bạn cần phải xác định một thuộc tính bổ sung. Nếu bạn kết hợp các cột, thì colspan, nếu chuỗi, sau đó rowspan. Giá trị của một thuộc tính chỉ ra số lượng các mục mà bạn muốn kết hợp.

Xin lưu ý rằng bạn cần phải xác định nó trong các yếu tố khu vực gần đỉnh. Ví dụ, trong hình trên, nếu bạn muốn kết hợp các tế bào 1 và 2, bạn cần phải xác định trong tế bào 1 colspan thuộc tính bằng giá trị của hai. Và xóa vị trí số 2 hoặc 3, nó không quan trọng.

Điểm mấu chốt là bạn nói với các tế bào sẽ mất bao nhiêu không gian. Giá trị mặc định là 1.

Hợp nhất các tế bào theo chiều dọc HTML bảng diễn ra trên cùng một nguyên tắc. Đơn giản chỉ cần không gian chiếm đóng sẽ được coi là theo chiều dọc. Xem hình bên dưới.

Ở đây, các tế bào với số lượng 43 mất hai chuỗi. Để làm điều này, bạn chỉ định rowspan thuộc tính. Chỉ cần nhớ:

• Row - hàng.
• Col - cột / cột.
• Span - Hiệp hội.

Các tác giả đã cố gắng để mang lại ngôn ngữ càng tốt để con người, do đó ngay cả khi không biết nó, bằng cách nào đó có thể hiểu được.

Trong HTML, sự kết hợp của các tế bào có thể được thực hiện theo hai hướng: theo chiều dọc và chiều ngang. Để làm điều này, chúng tôi xác định cả hai thuộc tính.

Các con số trên chỉ là điều đó và tuyên bố rằng hiệp hội có thể làm: hàng, cột, hoặc cả hai hàng và cột.

HTML: sáp nhập các tế bào. ví dụ

Chúng ta hãy xem xét ví dụ phức tạp hơn mốc trên bảng lớn. Dưới bên trái Đặt phiên bản gốc của một bảng thông thường. Quyền - một biến thể với sự kết hợp của hai tế bào ở hàng thứ hai. Vì vậy, rõ ràng hơn và dễ dàng hơn để so sánh các mã HTML.

Bạn cũng có thể kết hợp ba ở trung tâm của tế bào. Trong trường hợp đầu tiên thuộc tính colspan quy định các tế bào №1. Ở đây, đầu tiên sẽ là không thay đổi, và lần thứ hai thêm vào colspan, tương đương với ba.

Nếu bạn muốn kết hợp tất cả các tế bào trong một hàng để một duy nhất, sau đó loại bỏ bốn td trong lần đầu tiên cho thấy colspan = '5'.

Như bạn thấy, trên thực tế, mọi thứ đều đơn giản. Không có gì phức tạp. Quan trọng nhất, cẩn thận, từ lần đầu tiên để hiểu tất cả những cạm bẫy của các bảng, và sau đó không có vấn đề không nên xảy ra.

Bảng như một khuôn khổ trang web

Trong HTML, sự kết hợp của các tế bào không phải luôn luôn sử dụng cho các bảng thường xuyên với các thông tin (trong Word hoặc Excel). nhà thiết kế trang web thường xuyên, nhưng trước khi các cuộc thăm dò đã sử dụng chúng cho cách bố trí của các trang web.

Ví dụ, hãy xem xét cách bố trí của trang web. Thiết kế này - rất đơn giản và thô sơ. Nhưng bạn có thể hiển thị việc sử dụng các hiệp hội một cách rõ ràng.

Có ban đầu là một bảng của ba hàng của mỗi hai tế bào. Sau đó, để đặt logo của trang web, hai tế bào trong hàng đầu tiên đã được kết hợp. Điểm mấu chốt là làm như vậy để thích ứng với "tầng hầm".

Do vị trí của nó người ta có thể đặt các yếu tố của thiết kế, và không có gì sẽ không rời khỏi giới hạn của nó. Đây là một rất thuận tiện và đơn giản. Vì vậy, nó rất phổ biến. Bây giờ, nó được khuyến khích để tạo ra một khối div tag.

phần kết luận

Và hãy nhớ rằng việc sáp nhập ô trong bảng HTML, bạn có thể làm bất cứ điều gì bạn muốn. Tất cả phụ thuộc vào những gì bạn muốn và làm thế nào bạn muốn sắp xếp nó. Quan trọng hơn, không bị lẫn lộn. Nếu bạn muốn tạo một bảng lớn với một số lượng lớn của các hiệp hội, nó được khuyến khích để thu hút tất cả vào một mảnh giấy hoặc trong Paint. người mới bắt đầu Imposer nó sẽ được dễ dàng hơn.

Khi kinh nghiệm tăng, các hoạt động này, bạn có thể thực hiện trong đầu của bạn một cách dễ dàng.