Common styles of html5 tag css3

name: has the following 6 values:
application-name: document name or application name. The entire document can only contain one value.
author: document author
description: document description
generator: program that generates documents.
keywords: Web page keywords, separated by English commas.

Baidu

href: path
src: image path

tag attributes
Border border
Cellspacing table outer margin
Cellpadding table inner margin
Align position
Bgcolor: background color
Background: background image
Bordercolor: border color

in table

colspan across 2 columns

rowspan across rows

type value

text text

password password

radio single choice

checkbox multi-select

reset reset

file file upload

submit submit form

image graphic submission

button normal button

group drop-down

Yantai
Qingdao
Weihai


bj
tam
zong



Text area textarea " disabled="disabled">
1
cols width rows height readonly readonly

css style

font, font size:
font (abbreviation)
font-weight (thickness) normal (normal) bold (bold ) italic (italic)
font-size (size)
font-family (font family)
font-style (font style)

Font color:
color
opacity (transparency css3)

line spacing , alignment, etc.:
line-height (line height)
text-align (alignment)
letter-spacing (character spacing)
text-decoration (text modification)
overflow Hide the excess part
text-overflow

text-overflow Text cropping clip does not add when cropping text... ellipsis adds when cropping... Note: no line wrapping and over-flow control

text-shadow shadow
text-indent

Background attribute:
background (abbreviated form)
background -color (background color)
background-image (background image)
background-repeat (background image repetition method)
background-position (position coordinates, offset)

Commonly used lists

list-style: none none Style disc solid circle circle hollow circle square solid square decimal number

Box attributes:
margin (margin/border) Mainly above, you can write 1, 2, 4 values ​​
border (border)
padding (inner edge) distance/padding)

, you can add -top and other directions

border-radius border rounded corner

box-shadow shadow

Transformation effect: transform

transform-origin specifies the starting point of the transformation

none no transformation

translate (length value or percentage) translate Skewer The time to complete the transition

transition-timing-function specifies the transition function. The default value of the easing effect is equal to (0.25, 0.1, 0.25, 1.0)

transition-delay specifies the delay time for the transition to start to appear

@keyframes: Define an animation

animation

<style>          
  .t5{
            transition: 5s ease-out all;   /*过渡   ease    in 加速   out减速*/
        }/*transition-delay延迟*/
        .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 1s;
           /* animation-iteration-count: infinite;*//*无限循环*/
            background-color: yellow;
            width: 200px;height: 200px;

        }

 </style>

<div class="kt t5"></div>