My CSS study notes

1. The modified text in text-Decoration: Blink (blinking text) has been unable to display the current browser.

2. The text in the element arranged text-align = left: The justify . In order to effect alignment of both ends of the line of text is to be noted, however is less than one line of text can not show this effect, and the last line of a paragraph can not show this effect.

3. set the text shadow and blur text-shadow , is controlled in text-shadow property page style (style), however, At present, only the Safari browser supports text-shadow. If you want to achieve other browsers text-shadow effects, you must use some other technology or attributes. Of course, pure "CSS" is also possible. The syntax is:
text-Shadow: Opacity Color length length
wherein,
Color: the color of the shadow set;
length: Set value shadow horizontal extension;
length: Set value of the shadow vertical extension;
Opacity: floating-point numbers and units identified by the length value is not composed of a negative effect from the specified blur If you only need to blur, the first two are all set to 0. length.
Note: this property only supports Safari browser.
Note: the above four attribute is written together
Note: pseudo-classes can be used : first-letter and : First-Line .

4. White-Space: preWide preformatted text font used like. Do not merge blank distance between words and conduct Justify but in reality they do not see results, or multiple spaces will be merged into one, because ie Dui. White-Space: pre resolution does not meet the criteria css1, is a bug.

5. the text-underline-position only with text-decoration: underline associated with order to be effective, with other properties, for example, text-decoration: overline, text- decoration: line-through and so can not produce the effect .text-underline-position : above same effect as Decoration-text: overline.

6. border-style : none | hidden | dotted | Dashed | Solid | Double | Groove | Ridge | the inset from the | OUTSET
none: no border. And any specified border-width value independent of
hidden: hidden borders. IE does not support
dotted: IE4 IE5.5 + + and the dotted line in the WINDOWS and UNIX platforms MAC internet. Otherwise, a solid line
dashed: in IE4 + MAC platform and the WINDOWS IE5.5 + and UNIX platforms as a dashed line. Otherwise solid line
solid: Solid border
double: double-line border. Two-line and spaced therefrom equal to the specified border-width value
groove: The border-color value Videos 3D groove
ridge: The border-color value Videos rhombic frame
inset: The border-color value Videos 3D concave side
outset : the border-color value Videos 3D convex edge
Note:
If all four parameters provided, will be the - Right - lower - left order to act on four borders.
If only one will be used for all four sides.
If two, one for the first - next, the second for left - right.
If three provided, for the first, second for left - right, for the third.
To use this property, the object must be set height or width attribute or set position attribute is absolute.
If the border-width not greater than 0, this attribute would be removed.
Corresponding to the script of the borderStyle.

7. The border-bottom : border-width || border-style || border Color-
wherein-width border: Medium | Thin | Thick | length of parameters:
Medium: default width of the
thin: less than the default width
thick: greater than the default width
length: length value by the floating point numbers, and unit identifier. Is not negative.
Note:
If all four parameters provided, will be the - Right - lower - in the order of four acting left border
If only one will be used for all four sides.
If two, for the first - next, the second for the left - and right
if provided three, one for the first, second for left - right, for the third.
to use this property must set the target height or width attribute or set position attribute is absolute.
If the border-styleSet to none, this property would be removed.
Corresponding to the script of the borderWidth.

8. The margin also known as an outer patch, represents the space around the margins, define the elements; padding the known patch, showing the gap between the filling element border and define the content of the element.

9. The List-style : style-List-type | list-style-position | list- style-image
examples all attributes simultaneously: list-style: Disc Inside URL ( "xx.jpg")

10. the list-type-style setting list item type flag (hereinafter labeled with CSS1 is the value that can be used):
Disc: CSS1 solid circle
circle: CSS1 hollow round
Square: CSS1 closed squares
decimal:
 CSS1 Arabic numerals
Lower-Roman:
 CSS1 lowercase Roman numerals
Upper-Roman:
 CSS1 uppercase Roman numeral
Lower-Alpha:
 CSS1 lowercase letters
Upper-Alpha:
 CSS1 capital letters
none:
 CSS1 does not use bullets
armenian:  CSS2 traditional Armenian digital
CJK-ideographic: CSS2 plain ideographic numbers
georgian: CSS2 traditional George digital
Lower-greek: CSS2 basic Greek lowercase letters
hebrew: CSS2 traditional Hebrew digital
Hiragana: CSS2 Japanese hiragana characters
hiragana- Iroha: the CSS2 ID Hiragana
Katakana: the CSS2 Katakana characters
Katakana-Iroha: the CSS2 Katakana No.
Lower-Latin: the CSS2 Latin small letter
Upper-Latin: the CSS2 capital Latin
Description:
If the list-style-image attribute is none or specify image is not available, list-style-type property takes place.
act only having the display list-Item object (e.g., li object) is equal.
All list type characteristics ol objects and ul objects for the Note: items (such as li objects) specified list of attributes.
IE5.5 does not yet support the value of all CSS2.
corresponding to the script of thethe listStyleType .

11. The List-style-position : Inside | Outside setting item list listing tag is placed in a position
outside: List item marker is placed outside the text, and the surrounding text is not in accordance with the alignment mark
inside: List item marker is placed within the text, the alignment mark and the surrounding text
Definitions:
act only having display values equal to the list-item objects (e.g., objects li).
Note: all list items (e.g., an object li) after the object type characteristics ol and its specified list of objects ul attribute
corresponding to the script of the listStylePosition.

12. the line-height : Number setting a number, this number will be multiplied by the current font size to set the line spacing.

13. Clip: RECT (Top, right, bottom, left)
Clipping the Chinese interpretation of the meaning of that clip, this attribute determines which parts of the object can be seen. it does not change the nature of any object.
clipping area is a rectangle, and the rectangle's size depends on the positions of the four sides of .
The four sides are represented by top, right, botton, left.
Please note:The positions of the four sides with respect to the object rather than to the window, and this property and to position: absolute only together with effects such as:.
IMG
{
position: absolute;
Clip: RECT (0px, 50px, 200px, 0px)
}
script syntax: object.style.clip = "rect (0px, 50px, 200px, 0px)"


14.IE does not support pseudo-class : lang

 

15. Set the width resolution adaptive

min-width:760px;

width: expression(document.body.clientWidth < 840? "800px": "85%" );

 

 16. Let go beyond the table td width text automatically generated "..."

First, the table style plus the "table-layout: fixed", then the style of plus td "overflow: hidden; text-overflow: ellipsis; white-space: nowrap" can be realized.


 

 

Reproduced in: https: //www.cnblogs.com/guoxiaowen/archive/2008/02/21/1076845.html

Guess you like

Origin blog.csdn.net/weixin_33766805/article/details/93329974