Hướng dẫn css change label text - css thay đổi văn bản nhãn

Tôi có đoạn mã mã:

    
   Post this question to my friends on 
      
         
            Facebook
         
      .
   

Tôi muốn thay đổi văn bản trong trường thông qua CSS.

Tôi biết tôi có thể làm điều đó bằng cách đặt bản sao sao chép của đoạn trích này và sử dụng CSS để chuyển đổi. Tuy nhiên, tôi muốn làm điều đó thay đổi mã tối thiểu. Có thể sử dụng một số thủ thuật CSS để thay đổi văn bản và hoàn toàn không ảnh hưởng đến mã bên trong .

TNK

4.15315 Huy hiệu vàng56 Huy hiệu bạc81 Huy hiệu đồng15 gold badges56 silver badges81 bronze badges

Đã hỏi ngày 5 tháng 3 năm 2013 lúc 1:25Mar 5, 2013 at 1:25

3

Bạn không thể thay đổi văn bản với CSS. Ngoại lệ cho quy tắc này là các yếu tố ::before và ::after psuedo. Về lý thuyết, bạn có thể sử dụng các lớp để chuyển đổi văn bản như vậy:

label[for="share_me"]:before{content:'Post this question to my friends on '}
label[for="share_me"].othertext:before{content:'Some other text!'}

Tuy nhiên, chỉ vì bạn có thể không có nghĩa là bạn nên. Đó là một cơn ác mộng tiếp cận, và bạn có thể tưởng tượng quay lại sau và cố gắng tìm ra nơi văn bản đến từ nếu không phải từ HTML?

Đã trả lời ngày 5 tháng 3 năm 2013 lúc 1:31Mar 5, 2013 at 1:31

6

Theo ví dụ tại https://blog.escapecreative.com/how-to-replace-text-with-css/, đây là những gì làm việc cho tôi:

label[for="donate-choice-14724"]{
    visibility: hidden;
    position: relative;
}
label[for="donate-choice-14724"]:after{
    visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content:'Make this donation monthly';
}

Đã trả lời ngày 23 tháng 4 năm 2019 lúc 19:25Apr 23, 2019 at 19:25

Jaime Montoyajaime MontoyaJaime Montoya

6.27410 Huy hiệu vàng64 Huy hiệu bạc92 Huy hiệu Đồng10 gold badges64 silver badges92 bronze badges

Bạn chỉ có thể thay đổi nội dung của: trước và: sau khi giả với CSS. Câu trả lời của Ali Bassam bên dưới cho thấy cách 'hacky' để hiển thị nội dung giả trên cha mẹ để bạn có thể kiểm soát nó. Các vấn đề với giải pháp này bao gồm, tốt, nó có vẻ như hack và cũng là sự hỗ trợ hạn chế của các yếu tố giả. Nhưng điều đó có thể không có vấn đề cho dự án của bạn.

Một điều khác cần xem xét là bạn có quyền kiểm soát hạn chế đối với việc chuyển đổi với CSS. Hai tùy chọn của bạn là các truy vấn truyền thông và các lớp giả quen thuộc. Nếu nhu cầu chuyển đổi của bạn vượt xa những gì những người đó có thể làm, bạn sẽ chuyển sang JavaScript tốt nhất.

Đã trả lời ngày 5 tháng 3 năm 2013 lúc 1:32Mar 5, 2013 at 1:32

JamesPleasejamesPleasejamesplease

12.2k6 Huy hiệu vàng46 Huy hiệu bạc71 Huy hiệu đồng6 gold badges46 silver badges71 bronze badges

1

Tìm hiểu làm thế nào để tạo ra nhãn với CSS.

Thành công Info Warning Danger Other

Cách tạo kiểu nhãn

Bước 1) Thêm HTML:

Thí dụ

Thành công
Info
Warning
Danger
Other

Cách tạo kiểu nhãn

Thí dụ

Bước 2) Thêm CSS:
  color: white;
  padding: 8px;
}

.Label {& nbsp; & nbsp; color: white; & nbsp; & nbsp; padding: 8px;}
.info {background-color: #2196F3;} /* Blue */
.warning {background-color: #ff9800;} /* Orange */
.danger {background-color: #f44336;} /* Red */
.other {background-color: #e7e7e7; color: black;} /* Gray */

.Success {nền tảng nền: #04aa6d;} / * xanh * /.info {màu nền: #2196f3;} / * màu xanh * /. {màu nền: #f44336;} / * red * / .other {màu nền: #e7e7e7; màu: đen;} / * màu xám * /