2 - Css

CSS Dimension
Property Description
height Sets the height of an element
Value
auto,length % inherit none,length % Inherit none, length % Inherit
max-height
Sets the maximum height of an element Sets the maximum width of an element
max-width
min-height
Sets the minimum height of an element

Sets the minimum width of an element Sets the width of an element
length % Inherit
length % Inherit auto, length % inherit
min-width
width
CSS Display
Property Description Value
display Sets how/if an element is displayed none, inline, block list-item, run-in, compact, marker, table, inline-table table-row-group, tableheader-group, tableheader-group, table-row, table-column-group, table-column, table-cell, table-caption
visibility
Sets if an element should be visible or invisible
Visible hidden collapse
CSS Positioning
The CSS positioning properties allow you to position an element. It can also place an element behind another, and specify what should happen when an element's content is too big.

Static Positioning Fixed Positioning Relative Positioning Absolute Positioning
Overlapping Elements
{z-index:value}
Note:An element with greater stack order is always in front of an element with a lower stack order.
CSS Float
Property
clear
Description
Specifies which sides of an element where other floating elements are not allowed Specifies whether or not a box should float
Values
left right both none, inherit left right none inherit
float
CSS Align
A block element is an element that takes up the full width available, and has a line break before and after it. Examples of block elements:
<h1> <p> <div>
Aligning Block Elements
Center Aligning Using the margin Property Left and Right Aligning Using the position Property Left and Right Aligning Using the float Property
Cross-browser Compatibility Issues:
To avoid affecting the text in the original <div>, add a new <div> as a container with text-align Predefine margin and padding for the <body> element.
CSS Pseudo-classes
CSS pseudo-classes are used to add special effects to some selectors. Syntax:

selector:pseudo-class {property:value} selector.class:pseudo-class {property:value}
Anchor Pseudo-classes

a:link {color:#FF0000} /* unvisited link */ a:visited {color:#00FF00} /* visited link */ a:hover {color:#FF00FF} /* mouse over link */ a:active {color:#0000FF} /* selected link */
CSS - The :first-child Pseudo-class

p:first-child { color:blue }
Match the first <i> element in all <p> elements

p > i:first-child { font-weight:bold }
Match the first <i> element in all <p> elements

p:first-child i { color:blue }
CSS - The :lang Pseudo-class
<style type="text/css"> q:lang(no) {quotes: "~" "~"} </style>
Pseudo name Description :active Adds a style to an element that is activated :first-child Adds a style to an element that is the first child of another element :focus Adds a style to an element that has keyboard input focus :hover Adds a style to an element when you mouse over it :lang Adds a style to an element with a specific lang attribute :link Adds a style to an unvisited link :visited Adds a style to a visited link
CSS Pseudo-elements
Syntax:
selector:pseudo-element {property:value} selector.class:pseudo-element {property:value}
Pseudo name Description

:after
:before
:first-letter
:first-line
Adds content after an element Adds content before an element Adds a style to the first character of a text Adds a style to the first line of a text
Eg:
p:first-line { color:#ff0000; font-variant:small-caps; } p:first-letter { color:#ff0000; font-size:xx-large; } h1:before { content:url(smiley.gif); } h1:after { content:url(smiley.gif); }
p.article:first-letter {color:#ff0000} Multiple Pseudo-elements
Image Gallery
Look to img.html
Image Transparency Look to img1.html CSS Media Types The @media Rule
@media screen,print
Media Type
all aural
Description
braille
embossed handheld print projection screen tty
tv
Used for all media type devices Used for speech and sound synthesizers Used for braille tactile feedback devices Used for paged braille printers Used for small or handheld devices Used for printers Used for projected presentations, like slides Used for computer screens Used for media using a fixed-pitch character grid, like teletypes and terminals Used for television-type devices

2 - Css

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

2 - Css

Загружено:

Авторское право:

Доступные форматы

CSS Dimension

Sets the minimum height of an element

Sets if an element should be visible or invisible

Visible hidden collapse

Static Positioning Fixed Positioning Relative Positioning Absolute Positioning

Aligning Block Elements

Cross-browser Compatibility Issues:

selector:pseudo-class {property:value} selector.class:pseudo-class {property:value}

CSS - The :first-child Pseudo-class

Match the first <i> element in all <p> elements

p > i:first-child { font-weight:bold }

Match the first <i> element in all <p> elements

CSS - The :lang Pseudo-class

<style type="text/css"> q:lang(no) {quotes: "~" "~"} </style>

Pseudo name Description

p.article:first-letter {color:#ff0000} Multiple Pseudo-elements

Вам также может понравиться