Skip to main content

Posts

css introduction

What is CSS? •Stands for Cascading Style Sheet •CSS allows you to style HTML elements, or define how they are displayed. •Styles are normally stored in Style Sheets •External Style Sheetscan save you a lot of work •External Style Sheets are stored in CSS files •Multiple style definitions will cascadeinto one •Examples: –Changing the color of text –Specifying the size and position of a div What is CSS? (cont.) •CSS is an alternative to the “style” attribute. – <div style=“height:500px; width:200px”></div> •Advantages: –Can control the style of many different elements with a single command. –Separation of function: HTML can focus on content while CSS handles styling. CSS (Cascading Style Sheet) •Simple mechanism for adding style to web page •Code be embedded into the HTML file •HTML tag: <style type=“text/css”>CODE</style> •Also be in a separate file FILENAME.css •HTML tag: <link rel=“stylesheet” href=“scs.css” type=“text/css”> •St
Post a Comment
Read more

Other Elements used in Forms

Option The list items are added to the <SELECT> element by inserting <OPTION></OPTION> elements. The Option Element’s attributes are: § SELECTED : When this attribute is present, the option is selected when the document is initially loaded. It is an error for more than one option to be selected. § VALUE : Specifies the value the variable named in the select element. <HTML> <HEAD></ HEAD> <BODY> <h2><font color=blue>What type of Computer do you have?</font><h2> <FORM> <SELECT NAME=" ComputerType " size=4>    <OPTION  value="IBM" SELECTED> IBM</OPTION>   <OPTION  value="INTEL"> INTEL</OPTION>   <OPTION value=" Apple"> Apple</OPTION>   <OPTION value="Compaq"> Compaq</OPTION> </SELECT> </FORM></BODY></HTML>   Output  
Post a Comment
Read more

SELECT

§ The two following examples are <SELECT></SELECT> elements, where the attributes are set differently. The Select elements attributes are: § NAME : is the name of the variable to be sent to the CGI application. § SIZE : this sets the number of visible choices. § MULTIPLE : the presence of this attribute signifies that the user can make multiple selections. By default only one selection is allowed. Example on <SELECT> <BODY bgcolor = lightblue > <form> Select the cities you have visited: <SELECT name=“list”   size=5> <option> London</option> <option> Tokyo</option> <option> Paris</option> <option> New York</option> <option> LA</option> <option> KL</option> </SELECT> </form> </BODY> Output
Post a Comment
Read more

TEXTAREA

<TEXTAREA></TEXTAREA>: is an element that allows for free form text entry. Browser will display Textarea has the following attributes: § NAME : is the name of the variable to be sent to the CGI application. § ROWS : the number of rows to the textbox. § COLS : the number of columns to the textbox. <BODY bgcolor = lightblue > <form> <TEXTAREA    COLS=40   ROWS=20   Name="comments"   > HTML Hypertext Markup Language is the set of markup symbols or codes inserted in a file intended for display on a World Wide Web browser page The markup. </TEXTAREA>: </form> </BODY> Output
Post a Comment
Read more

File

File Upload : You can use a file upload to allow surfers to upload files to your web server. <INPUT TYPE=“FILE”> File Upload has the following attributes: • TYPE :   file. • SIZE : is the size of the text box in characters. • NAME : is the name of the variable to be sent to the CGI application. • MAXLENGHT : is the maximum size of the input in the textbox in characters. Example on File <BODY bgcolor = lightblue > <form> <H3><font color= forestgreen > Please attach your file here to for uploading to My <font color = red >SERVER...<BR> <INPUT  TYPE="File"  name=" myFile "  size="30"> <INPUT  TYPE="Submit"  value=" Submit File "> </form> </BODY>
Post a Comment
Read more

Reset button

Reset : It is a good idea to include one of these for each form where users are entering data. It allows the surfer to clear all the input in the form. • • <INPUT TYPE=“RESET”> Reset buttons have the following attributes: • TYPE : reset. • VALUE : determines the text label on the button, usually Reset. Example on Reset Button <FORM     Action="URL"         method="get"> First Name: <INPUT TYPE="TEXT" Size=25 name=" firstName "> <BR> Family Name: <INPUT TYPE="TEXT" Size=25 name=" LastName "><BR> <BR> <FONT Color = red> <STRONG><font size=5>Press Here to submit the data:</font></STRONG><BR> <INPUT TYPE="submit" VALUE=" SubmitData "> <INPUT TYPE="RESET" VALUE="Reset"> </FORM> Output
Post a Comment
Read more