cách căn giữa css chân trang


Câu trả lời 1:

Theo chiều dọc hay chiều ngang?

Nếu bạn muốn căn giữa văn bản theo chiều ngang trong một phần tử thì bạn sẽ sử dụng text-align: center. Một tùy chọn nếu bạn muốn căn giữa theo chiều dọc và bạn có chân trang có chiều cao cố định và một hàng văn bản, hãy đặt chiều cao dòng của bạn bằng với chiều cao của chân trang.

Ví dụ: nếu chân trang của bạn là 100px thì hãy đặt chiều cao dòng thành 100px. Điều này sẽ không hoạt động nếu bạn có nhiều dòng trong chân trang vì mỗi dòng sẽ cao 100px.

chân trang { vị trí: trái; rõ ràng: cả hai; màu: #ffffff; màu nền: rgb (75, 75, 75); text-align: center; chiều cao: 50px; chiều cao dòng: 50px; cỡ chữ: 80%; margin-left: -100%; margin-right: -100%;}

Câu trả lời 2:

Chỉ dọc:

Đi với Flexbox…

chân trang { hiển thị: flex; align-items: trung tâm;}

Chỉ ngang:

Flexbox một lần nữa…

chân trang { hiển thị: flex; justify-content: trung tâm;}

Theo chiều dọc và chiều ngang:

Hộp linh hoạt…

chân trang { hiển thị: flex; align-items: trung tâm; justify-content: trung tâm;}

Tóm lại, hãy sử dụng Flexbox :)

Hỗ trợ khá nhiều nếu bạn đang hỗ trợ IE10 +.


Câu trả lời 3:

Sẽ dễ dàng hơn nếu bạn thêm các phần tử bổ sung trong trang html của mình, thay vì chỉ có thành phần. Tuy nhiên, nếu bạn để nguyên html và chỉ muốn điều chỉnh CSS, bạn có thể xóa chiều cao của chân trang và thêm phần đệm trên cùng và dưới cùng vào chân trang.

chân trang { vị trí: trái; rõ ràng: cả hai; màu: #ffffff; màu nền: rgb (75, 75, 75); text-align: center;/ * chiều cao: 50px; * / cỡ chữ: 80%; margin-left: -100%; margin-right: -100%; đệm: 18px 0;}

Câu trả lời 4:

Đây là chân trang của tôi

không được căn giữa 110%, nhưng đủ gần để chứng minh một tính năng tuyệt vời của chrome, chỉnh sửa css trực tiếp. nhấn f12 rồi sử dụng công cụ chọn trên cùng bên trái để đồng hồ chân trang, sau đó sử dụng hộp khoảng cách css để di chuyển nội dung xung quanh. nhấp đúp vào bất kỳ “-” nào để đặt và nó cũng sẽ chấp nhận phần trăm, mặc dù chúng sẽ dựa trên cửa sổ nên 50% sẽ không hoạt động trong trường hợp này


Câu trả lời 5:

Đơn giản, bằng cách sử dụng đệm.

Padding được sử dụng để tạo không gian xung quanh nội dung.

Đối với ví dụ của bạn, hãy thêm dòng này:

  • padding-top: 25px;
  • Ngoài ra còn có padding-right, padding-bottom và padding-left.

    Hy vọng rằng sẽ giúp.


Câu trả lời 6:

Bạn cần đặt chiều rộng cho phần tử và sau đó đặt lề trái và phải thành tự động.

.centerthis {width: 600px; margin-left: auto; margin-right: tự động; }


Câu trả lời 7:

CSS

.footer {

text-align: center;

}

——————————————————————————————————-

HTML

Chân trang ở giữa


Câu trả lời 8:

Đây là một trang web khá tốt cho những lỗi CSS như vậy:

Căn giữa trong CSS: Hướng dẫn đầy đủ | Thủ thuật CSS

Hoặc chỉ cần thêm padding-top, padding-top: 25px; nên làm.


Câu trả lời 9:

Thêm “line-height: 50px;” sang kiểu chân trang


Câu trả lời 10:

Sử dụng một số phần đệm ở trên và dưới thay vì sử dụng chiều cao. Tham khảo mã bên dưới:

eBGVOj