Common styles of html5 tag css3 and html5css3
<Meta name = ''>
Name: has the following six values:
Application-name: Document name or application name. The entire document can contain only one value.
Author: author
Description: Document description
Generator: The program that generates the document.
Keywords: webpage keywords separated by commas.
<A href = "http://www.bkjia.com"> helping customers </a>
Href: Path
Src: Image path
<Table> label attributes
Border
Cellspacing table margin
Cellpadding table padding
Align location
Bgcolor: Background Color
Background: Background Image
Bordercolor: border color
<Tr> </tr>
<Td colspan = "2"> </td> colspan spans two columns
Rowspan cross-row
<Input type = "">
Type Value
Text
Password
Radio single choice
Multiple checkbox options
Reset
File Upload
Submit submission form
Image submission
Button common button
Group drop-down
Copy XML/HTML Code to clipboard
- <Select name = "city" id = "city">
- <Optgroup label = "Shandong">
- <Option value = "yt"> Yantai </option>
- <Option value = "qd"> Qingdao </option>
- <Option value = "wh"> Weihai </option>
- </Optgroup>
- <Optgroup label = "Beijing">
- <Option value = "bj"> bj </option>
- <Option value = "tam"> tam </option>
- <Option value = "zong"> zong </option>
- </Optgroup>
- </Select>
Text area textarea
Copy XML/HTML Code to clipboard
- <Textarea name = "textarea" id = "textarea" cols = "30" rows = "10" readonly = "readonly"
- Disabled = "disabled">
- 1 </textarea>
Cols width rows height readonly read-only
Css style
Font and font size:
Font (abbreviated form)
Font-weight (width) normal (normal) bold (bold) italic)
Font-size (size)
Font-family (font family)
Font-style (font style)
Font color:
Color
Opacity (Transparency css3)
Line spacing and alignment:
Line-height (Row height)
Text-align (align)
Letter-spacing (Character spacing)
Text-decoration)
Overflow hidden
Text-overflow
When cropping text in text-overflow, clip is not added when cropping text... ellipsis is added when cropping... note: no line breaks and over-flow Control
Text-shadow
Text-indent
Background attributes:
Background (abbreviated form)
Background-color (background color)
Background-image (background image)
Background-repeat (repeated background image)
Background-position (Location Coordinate and offset)
List frequently used
List-style: none no style disc solid circle hollow circle square solid square decimal number
Box properties:
Margin (outer margin/Boundary) and above can write 1, 2, and 4 values.
Border (border)
Padding (padding/padding)
Addend-top and other directions
Border-radius border rounded corner
Box-shadow
Deformation: transform
Transform-origin specifies the start point of the Transformation
None
Translate (length value or percentage) translateX translateY translates horizontally and vertically
Scale (numeric) scaleX scaleY scales horizontally, vertically, or in two directions
Rotate (angle) rotation element
Skew (angle) skewX skewY skews the element to a certain angle in the horizontal, vertical, or two directions
Matrix Customization
Transition effect: transition
Transition-property specifies the default value of the transition css property, which is all.
Transition-duration completion time
Transition-timing-function specifies that the default value of the easing effect of the transition function is equivalent to (0.25, 0.1, 0.25, 1.0)
Transition-delay specifies the delay time when the transition starts to appear
@ Keyframes: defines an animation.
Animation
Copy the content to the clipboard using CSS Code.
- <Style>
- . T5 {
- Transition: 5S between-out all;/* transition between in acceleration out deceleration */
- }/* Transition-delay latency */
- . T5: hover {
- Transform: skew (45deg, 45deg)
- }
- @ Keyframes key {
- 0% {
- Background-color: red; width: 200px; height: 200px;
- }
- 25% {
- Background-color: orange; width: 100px; height: 100px; transform: rotate (-90deg );
- }
- 50% {
- Background-color: yellow; width: 60px; height: 60px; transform: none;
- }
- 75% {
- Background-color: green; width: 120px; height: 120px; transform: none;
- }
- 100% {
- Background-color: blue; width: 200px; height: 200px; transform: rotate (360deg );
- }
- }
- . Kt {
- Animation: key 1 s;
- /* Animation-iteration-count: infinite; * // * infinite loop */
- Background-color: yellow;
- Width: 200px; height: 200px;
- }
- </Style>
- <Div class = "kt t5"> </div>
The above is a simple introduction to all the common styles of html5 tag css3. I hope you can provide more support ~