I am trying to change the content of an HTML label, but I do not have the capability to edit the HTML. Therefore, I am trying to change the text using CSS. Is there any selector to identify the label below, and if there is, how could I make the text show the word "Organization" instead of "Company"? Thank you.
<div class="control-group">
<label class="control-label" for="company" style="">Company</label>
<div class="controls">
<input id="settings-company" class="settings-company input-xlarge" type="text" data-config="required" value="My Organization" name="company">
</div>
</div>
The style attribute specifies the style, i.e. look and feel, of the <label> element. A style contains any number of CSS property/value pairs, separated by semicolons (;). The style attribute overrides any other style that was defined in a <style> tag or an external CSS file.
var element = document. querySelector("label[for=email]"); ...or in JavaScript using jQuery: var element = $("label[for=email]");
There are two ways to pair a label and an input. One is by wrapping the input in a label (implicit), and the other is by adding a for attribute to the label and an id to the input (explicit). Think of an implicit label as hugging an input, and an explicit label as standing next to an input and holding its hand.
We use the style attribute to set the font color in HTML. The style attribute specifies an inline style for an element, with the CSS property color. The attribute is used with the HTML <p> tag, with the CSS property color. HTML5 do not support the <font> tag, so the CSS style is used to add font color.
Hide the text with font-size:0;
and add a pseudo element.
label { font-size: 0; }
label:before { content: "Organization"; font-size: 14px; }
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With