Example : How to set color/forecolor and background color in a text box using CSS?
<!doctype html>
<html>
	<body>
		Name : <input type="text" style="color: red; background-color: yellow">	
	</body>
</html>

-----------------------------  OR  -------------------------------
<!doctype html>
<html>
	<head>
		<style>				
			#ipb
		            {
				color:white;    
                              <!--color:#05360A;-->
				background-color: yellow;
			    }
		</style>
	</head>	
	<body>
		Name : <input type="text" id="ipb">	
	</body>	
</html>

-----------------------------  OR  -------------------------------
<!doctype html>
<html>
	<head>
		<style>				
			.ipb
		            {
				color:red;
				background-color: yellow;
			    }
		</style>
	</head>	
	<body>
		Name : <input type="text" class="ipb">	
	</body>	
</html>
Example : How to align the text in a text box using CSS?
<!doctype html>
<html>
	<head>
		<style>				
		     .ipb
		        {
			text-align: right;
			//text-align: left;
			//text-align: center;
			//text-align: justify;
			}
		</style>
	</head>	
	<body>
		Name : <input type="text" class="ipb">	
	</body>	
</html>
Example : How to leave some space/indent in a text box/paragranph using CSS?
<!doctype html>
<html>
	<head>
		<style>				
			#ipb
		          {
			    text-indent: 60px;
			  }
                        #para
		          {
			    text-indent: 100px;
			  }
		 </style>
	</head>	
	<body>
		Name : <input type="text" id="ipb">
                <p id="para">----</p>	
	</body>	
</html>
Example : How to make a text box to convert any textual characters into lowercase letters.
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Codershelpline</title>	
	<style>
		input.stu{text-transform: lowercase;}	
	</style>	
</head>
<body>
	<form name="form1" method="post" action="#">		
        <fieldset>
            <legend>Sample Format of Simple HTML Page</legend>
            <table>            
                <tr>
                    <td>Name of Student</td>                    
                    <td>:</td>         
                    <td><input type="text" class="stu"></td>
                </tr>       
            </table>
        </fieldset>		
    </form>
</body>
</html>

 193 total views,  1 views today

Categories: CSS

0 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.