CSE 154: Web Programming Exam “Cheat Sheet” HTML
CSE 154: Web Programming Exam "Cheat Sheet"
HTML
Tags Used in the Section
Tag text
Description title shown on page tab page metadata links to a CSS style sheet link to JavaScript code comment (can appear in head or body)
Tags Used in the Section
Tag text text text ... text
text text text
text text
nested item text nested item text
Display Block Block
Block Inline Block Inline-block Inline Inline Block
Description paragraph (h1 for largest to h6 for smallest)
horizontal rule (line) line break anchor (link) image emphasis (italic) strong emphasis (bold) ordered (ol) and unordered (ul) list; list item (li)
CSE 154 Exam Cheat Sheet
Spring 2019 - Version 06/01/19
Tags Used in the Section (Continued)
Tag
term 1 description 1 term 2 description 2
Display Block
Description definition list (dl); term (dt), and its description (dd)
text ...
Block
block-level quotation
text text text
text
heading 1 heading 2
Inline Inline Inline Block
inline-level quotation computer code (monospace) pre-formatted text ( preserves whitespace) table of data (table)
description of table (caption) table row (tr) table heading cell (hr) normal table cell (td)
cell 1
cell 2
...
... ...
Block Inline
block-level section of a page inline-level section of a page
HTML5 Semantic Grouping Tags (all block elements)
Tag
Description Container for a header of a document Specifies the main content of a document. The content inside should be unique to the
document and not contain content that is repeated across pages (e.g., sidebars, nav links, search bars, etc.) Container for a footer of a document A standalone piece of content (e.g., entire blog post including title, author, etc.) A piece of content that is part of another (e.g., a chapter section of a reading) Defines some content aside from the content it is placed in (e.g., a sidebar in an article) Defines content in a navigation bar
CSE 154 Exam Cheat Sheet
Spring 2019 - Version 06/01/19
HTML Input Tags
Tag
content
content
Display Inline
Inline
Inline
initial text
text
text
Inline Inline
text text
...
text content
Block
Description clickable button type can be submit, reset, button form element input tag type can be text, number, checkbox,
radio, file, etc. multi-line text input box
clickable text l abel around a form control drop-down selection box (select); each option within the box (option); a labeled group of option (optgroup);
a grouped set of form fields with a legend
HTML Entities Reference
Result
< @ > & ?
Description non-breaking space less than at symbol greater than ampersand copyright
Entity Name < @ > & ©
CSE 154 Exam Cheat Sheet
Spring 2019 - Version 06/01/19
CSS
For the following property and value tables, anything emphasized represents values that should be replaced with specific units (e.g., length s hould be replaced with a px, pt, or em for many properties, and color s hould be replaced with a valid color value such as a hex or rgb code).
A use of | refers to separation of possible values (where you cannot provide two of these possible values for one property) and [value value value] refers to a grouping of possible values that can optionally be used together (e.g., [h-shadow v-shadow blur spread color] f or box-shadow).
Selector Types
Name
Description
Example(s)
Universal Element Grouping Class
Any element
.foo * { font: 10pt Arial; }
Any element of a given type
h1 { text-decoration:
underline; }
Multiple elements of different types h1, h2, h3 { color: purple; }
Elements with the given class name
.example { text-decoration: underline; }
Id
Single element with the given id #example { text-decoration: overline; }
Descendant Elements that are children at any #example h1 { level of another specified element text-decoration: underline;
Child
Elements that are direct children of another specified element
} #example > p { font-weight: bold; }
Attribute
Elements that have the specified input[selected] - inputs that have the selected
attribute
attribute
input[name='test'] - inputs that have a name 'test'
Background Styles
Property background-color background-image background-origin background-position
background-size background-repeat background-attachment
Values color | transparent url | none
border-box | padding-box | content-box
top left | top center | top right | center left | center center | center
right | bottom left | bottom center | bottom right [x-% y-% ] | [x-pos y-pos ] length | % | auto | cover | contain
repeat | repeat-x | repeat-y | no-repeat
scroll | fixed
CSE 154 Exam Cheat Sheet
Spring 2019 - Version 06/01/19
Border Styles
Note: Replace '*' with any side of the border (top, right, left, bottom) for the desired effect.
Example style: 'border: 2px solid red' applies a solid red border with a width of 2px to all four sides of the element, while 'border-left: 2px solid red' only applies that border to the left border'.
Property
Values
border, border-* (shorthand) border-width,
border-*-width border-style,
border-width, border-*-width
border-style, border-*-style
border-*-style border-color, border-*-color thin | medium | thick | length
none | hidden | dotted | dashed | solid | double | groove | rigid | inset | outset
border-color,
color
border-*-color box-shadow
none | inset | [h-shadow v-shadow blur spread color ]
border-radius
length
Font and Text Styles
Property font-style font-family font-size font-weight text-align text-decoration text-shadow text-indent text-transform list-style-type
Values normal | italic | oblique | inherit fontname length | % normal | bold | inherit left | right | center | justify none | [underline overline line-through blink] none | [color length ] length | % none | capitalize | uppercase | lowercase none | asterisks | box | check | diamond | disc | hyphen | square | decimal | lower-roman | upper-roman | kower-alpha | upper-alpha | lower-greek | upper-greek | lower-latin | upper-latin | footnotes
CSE 154 Exam Cheat Sheet
Spring 2019 - Version 06/01/19
................
................
In order to avoid copyright disputes, this page is only a partial summary.
To fulfill the demand for quickly locating and searching documents.
It is intelligent file search solution for home and business.
Related download
- new the complete html cheat sheet stony brook university
- html cheat sheet
- html cheat sheet december
- html and css cheat sheet tn code academy
- html cheat sheet a simple guide to html
- basic html cheat sheet 1 camas high school
- new the complete html cheat sheet
- html color code cheat sheet php
- html cheat css
- beginner s html cheat sheet
Related searches
- cheat sheet for word brain game
- macro cheat sheet pdf
- logarithm cheat sheet pdf
- excel formula cheat sheet pdf
- excel formulas cheat sheet pdf
- excel cheat sheet 2016 pdf
- vba programming cheat sheet pdf
- macro cheat sheet food
- free excel cheat sheet download
- onenote cheat sheet pdf
- punctuation rules cheat sheet pdf
- excel formula cheat sheet printable