Hướng dẫn how do i align text on both sides in html? - làm cách nào để căn chỉnh văn bản ở cả hai bên trong html?

Điều gì sẽ là mã tốt nhất để có hai bit văn bản trong một đoạn, một đoạn bên trái được căn chỉnh, cái còn lại được căn chỉnh, đó cũng là:

  • Mã ít nhất có thể
  • dễ dàng nhất để khách hàng hiển thị (tức là sử dụng ít tài nguyên nhất)

Tôi thêm cái cuối cùng này để chắc chắn

sẽ bị loại trừ. Đây không chỉ là một con thú mã so với một vài con số được tạo kiểu đúng cách Văn bản trong họ ...

Nếu bạn không chắc ý tôi là gì, thì đây là một ví dụ: chân trang có bên trái được căn chỉnh tên của người dùng hiện đang đăng nhập và trên cùng một dòng bên phải đã căn chỉnh ngày và giờ hiện tại và/hoặc phiên bản trang web.

hỏi ngày 27 tháng 10 năm 2010 lúc 11:49Oct 27, 2010 at 11:49

Hướng dẫn how do i align text on both sides in html? - làm cách nào để căn chỉnh văn bản ở cả hai bên trong html?

Stijn Sandersstijn SandersStijn Sanders

35.3k11 Huy hiệu vàng44 Huy hiệu bạc66 Huy hiệu đồng11 gold badges44 silver badges66 bronze badges

2

Số lượng đánh dấu ít nhất có thể (bạn chỉ cần một nhịp):

This text is left. This text is right.

Cách bạn muốn đạt được các kiểu trái/phải là tùy thuộc vào bạn, nhưng tôi sẽ giới thiệu một phong cách bên ngoài trên ID hoặc một lớp.

HTML đầy đủ:

This text is left. This text is right.

Và CSS:

.split-para      { display:block;margin:10px;}
.split-para span { display:block;float:right;width:50%;margin-left:10px;}

Hướng dẫn how do i align text on both sides in html? - làm cách nào để căn chỉnh văn bản ở cả hai bên trong html?

Đã trả lời ngày 27 tháng 10 năm 2010 lúc 11:55Oct 27, 2010 at 11:55

3

Cách duy nhất duy nhất để làm điều này là

Text on the right Text on the left

Tuy nhiên, điều này sẽ khiến bạn gặp rắc rối nếu văn bản tràn ra. Nếu bạn có thể, hãy sử dụng

This text is left. This text is right.

3s (các phần tử cấp khối) và cung cấp cho họ một

This text is left. This text is right.

4 cố định.

Một bảng (hoặc một số

This text is left. This text is right.

3 với các thuộc tính

This text is left. This text is right.

6) trên thực tế sẽ là giải pháp an toàn nhất cho việc này - sẽ không thể phá vỡ, ngay cả khi bạn có nhiều nội dung khó khăn.

Đã trả lời ngày 27 tháng 10 năm 2010 lúc 11:53Oct 27, 2010 at 11:53

Hướng dẫn how do i align text on both sides in html? - làm cách nào để căn chỉnh văn bản ở cả hai bên trong html?

PekkapekkaPekka

436K139 Huy hiệu vàng966 Huy hiệu bạc1082 Huy hiệu Đồng139 gold badges966 silver badges1082 bronze badges

0

Tôi sẽ không đặt nó trong cùng một

This text is left. This text is right.

2, vì IMHO hai info về mặt ngữ nghĩa quá khác nhau. Nếu bạn phải, tôi sẽ đề xuất điều này:

I'll be on the left I'll be on the right

Đã trả lời ngày 27 tháng 10 năm 2010 lúc 11:53Oct 27, 2010 at 11:53

PekkapekkaBoldewyn

436K139 Huy hiệu vàng966 Huy hiệu bạc1082 Huy hiệu Đồng44 gold badges153 silver badges208 bronze badges

1

Hướng dẫn how do i align text on both sides in html? - làm cách nào để căn chỉnh văn bản ở cả hai bên trong html?

Tôi sẽ không đặt nó trong cùng một

This text is left. This text is right.

2, vì IMHO hai info về mặt ngữ nghĩa quá khác nhau. Nếu bạn phải, tôi sẽ đề xuất điều này:different sizes and they must be underlined this is the solution:

January 2014

css:

table{
    width: 100%;
    border-bottom: 2px solid black;
    /*this is the size of the small text's baseline over part  (≈25px*3/4)*/
    line-height: 19.5px; 
}
table td{
    vertical-align: baseline;
}
.left{
    font-family: Arial;
    font-size: 40px;
    text-align: left;

}
.right{
    font-size: 25px;
    text-align: right;
}

Boldewynboldewyn

79,8K44 Huy hiệu vàng153 Huy hiệu bạc208 Huy hiệu đồngMar 26, 2014 at 13:39

2

Nếu các văn bản có kích thước khác nhau và chúng phải được gạch chân thì đây là giải pháp:

Bản demo ở đây

January2014

Đã trả lời ngày 26 tháng 3 năm 2014 lúc 13:39

.right {
    margin-left:100%;
}

Tôi đã sử dụng điều này trong quá khứ:

HTMLAug 1, 2014 at 12:33

Hướng dẫn how do i align text on both sides in html? - làm cách nào để căn chỉnh văn bản ở cả hai bên trong html?

Chips147Chips147Chips147

CSS3 gold badges5 silver badges12 bronze badges

Trình diễn

  1. Đã trả lời ngày 1 tháng 8 năm 2014 lúc 12:33

    5253 Huy hiệu vàng5 Huy hiệu bạc12 Huy hiệu Đồng

  2. Ok những gì bạn có thể muốn sẽ được cung cấp cho bạn bằng kết quả của:

    trong CSS:

Div {Cột Count: 2; }

trong html:

Một số văn bản, bla bla blaOct 9, 2019 at 11:52