I'm building a form using Bootstrap. Some of the fields are read only so the value is displayed a text (not an input field).
I want the label on the left to be bold and the value on the right to be regular (not bold).
Here's the code and a screenshot ... what is the correct way to have the value on the right display as regular font (not bold)?
<form> <div> <div> <label for="inputAppID">App Name</label> <div> <label>Stephen's Library</label> </div> </div> <div> <label for="inputTableName">DB Connection</label> <div> <label>Stephen's Library DB Connection</label> </div> </div> <div> <label for="inputTableName">DB Table Name</label> <div> <label><%=entityDefDTO.getTableName()%></label> </div> </div> <div> <label for="inputEntityName">Entity Name</label> <div> <input type="text" placeholder="ex. Book"> </div> </div> <div> <label for="inputEntityName">Entity Name Plural</label> <div> <input type="text" placeholder="ex. Books"> </div> </div>
</div> 4 4 Answers
use:
font-weight-boldlike:
App Name Stephen's Library
<div> <label for="inputTableName">DB Connection</label> <div> <label>Stephen's Library DB Connection</label> </div> </div> <div> <label for="inputTableName">DB Table Name</label> <div> <label><%=entityDefDTO.getTableName()%></label> </div> </div> <div> <label for="inputEntityName">Entity Name</label> <div> <input type="text" placeholder="ex. Book"> </div> </div> <div> <label for="inputEntityName">Entity Name Plural</label> <div> <input type="text" placeholder="ex. Books"> </div> </div>
</div> You may put the class "font-weight-bold" for label on the left to be bold and the "font-weight-normal" for the value on the right to be regular (not bold).
<p>Bold text.</p>
<p>Bolder weight text (relative to the parent element).</p>
<p>Normal weight text.</p>
<p>Light weight text.</p>
<p>Lighter weight text (relative to the parent element).</p>
<p>Italic text.</p> 1 After learning more, I see that the only CSS that is used by the project is this ...
For my problem text, the label tag has font-weight: 700; ... so it turns out the font displayed is not actually "bold" but has a high font weight.
I was able to get the desired effect by adding style = "font-weight:300" to the desired label.
use this
<label for="Gender">Gender :</label>worked for me
0