Menu Bar

Home
Introduction to HTML Tables Elements and Attributes Lists Google Home Page Registration Form Forms_1 Forms_2
Introduction to CSS Three types of css Tables Forms(id,class,psuedo class) Backgrounds Periodic table Border in a table Margins and Padding Height,Width,Overflow
Introduction Basic Script Data types and Operators String methods and Arrays Functions and Objects Events Dialog boxes Conditions Loops Error Handling External JS Simple Calculator
Introduction SQL Installation and User creation SQL:Database and Table Creation SQL:Alter Constraints Select,Insert Delete Operators Functions Joins, Union, GroupBy Missing Items User Defined Functions Views Backup and Restore Company DB, Table and records Queries on Company DB Computer Business DB and Queries
Introduction Variables, Datatypes & Operators Conditional & Looping Statements Functions Pointers & Recursion Array & Files Patterns
Introduction Problems in C++
Configuration SQL server connection Introduction to PHP
Introduction VB.NET VB.NET Compilation & Run VB.NET Problems No link
Design Principles Stone Profit support page MasterLegacy MasterDev Work with Live System

CSS: forms, selector, id, class, psuedo class

Task:1
           Design sample form and use the below selectors to apply the styles
           Selectors:
           1. Element Selector: Apply this to a div and input element
           2. ID: apply this to button element
           3. Class: apply this to table cells
           4. Attribute: apply this to <a> tag
           5. Pseudo class
Steps:
           1. Create a div and apply background-color.
           2. Create a form with in the div.
           3. Create a table with in the form and align it center.
           4. Apply cellspacing and cellpadding.
           5. Create two input text fields with submit button.
           6. Insert a image using img tag and create a anchor tag with an hyperlink.
           7. By using name, id, class apply some css properties.

Code:
          
   


Output:
           



Task:2
           Design sample form and use the below  selectors to apply the styles.
Pseudo class:
1. Use of Pseudo class selector.
2. Apply on mouse over for button and div.
3. Apply for text box focus.
4. Apply for link visited.

Code:

          

Output:
              
              



Subscribe to: Posts (Atom)