9
CSS LISTS, LINKS, TABLES Ms. Josephine T. Eduardo

CSS part2

Embed Size (px)

DESCRIPTION

css2

Citation preview

CSS LISTS

CSS LISTS, LINKS, TABLESMs. Josephine T. EduardoLISTSIn HTML, there are two types of lists:unordered lists - the list items are marked with bulletsordered lists - the list items are marked with numbers or letters

list-style-type: propertyExample:ul.a {list-style-type: circle;}ul.b {list-style-type: square;}

ol.c {list-style-type: upper-roman;}ol.d {list-style-type: lower-alpha;}

exampleCSS LINKSLinks can be styled with any CSS property (e.g. color, font-family, background, etc.).In addition, links can be styled differently depending on whatstatethey are in.The four links states are:a:link - a normal, unvisited linka:visited - a link the user has visiteda:hover - a link when the user mouses over ita:active - a link the moment it is clicked

Text Decoration

The text-decoration property is mostly used to remove underlines from linksa:link {text-decoration:none;}a:visited {text-decoration:none;}a:hover {text-decoration:underline;}a:active {text-decoration:underline;}

exampleBackground Color

The background-color property specifies the background color for links

a:link {background-color:#B2FF99;}a:visited {background-color:#FFFF85;}a:hover {background-color:#FF704D;}a:active {background-color:#FF704D;}exampleCSSTables

Table BordersTo specify table borders in CSS, use the border property.Example 1

CSS BUTTONSHTML tagClick Me!The tag defines a clickable button.Inside a element you can put content, like text or images. This is the difference between this element and buttons created with the element.

Attributes of Buttons

AttributeValueDescriptionautofocusNewautofocusSpecifies that a button should automatically get focus when the page loadsdisableddisabledSpecifies that a button should be disabledformNewform_idSpecifies one or more forms the button belongs toformactionNewURLSpecifies where to send the form-data when a form is submitted. Only for type="submit"formenctypeNewapplication/x-www-form-urlencodedmultipart/form-datatext/plainSpecifies how form-data should be encoded before sending it to a server. Only for type="submit"formmethodNewgetpostSpecifies how to send the form-data (which HTTP method to use). Only for type="submit"formnovalidateNewformnovalidateSpecifies that the form-data should not be validated on submission. Only for type="submit"formtargetNew_blank_self_parent_topframenameSpecifies where to display the response after submitting the form. Only for type="submit"namenameSpecifies a name for the buttontypebuttonresetsubmitSpecifies the type of buttonvaluetextSpecifies an initial value for the buttonNew