html在线时间,HTML的时间表

下载代码

html

css

js

分享到微信朋友圈

X

html

Timeline of HTML

October 1991

HTML Tags, an informal CERN document listing 18 HTML tags, was first mentioned in public.

June 1992

First informal draft of the HTML DTD.

November 1992

HTML DTD 1.1 the first revision with a version number, an informal draft.

June 1993

Hypertext Markup Language published by the IETF IIIR Working Group as an Internet Draft.

24 November 1995

HTML 2.0 was published as RFC 1866

25 November 1995

RFC 1867 (form-based file upload)

May 1996

RFC 1942 (tables)

August 1996

RFC 1980 (client-side image maps)

January 1997

RFC 2070 (internationalization)

14 January 1997

HTML 3.2 was published as a W3C Recommendation.

18 December 1997

HTML 4.0 was published as a W3C Recommendation.

24 April 1998

HTML 4.0 was reissued with minor edits

24 December 1999

HTML 4.01 was published as a W3C Recommendation

26 January 2000

XHTML 1.0 was published as a W3C Recommendation

May 2000

"ISO HTML", based on HTML 4.01 Strict was published as an ISO/IEC international standard.

31 May 2001

XHTML 1.1 was published as a W3C Recommendation.

28 October 2014

HTML5 was published as a W3C Recommendation.

1 November 2016

HTML 5.1 was published as a W3C Recommendation.

14 December 2017

HTML 5.2 was published as a W3C Recommendation.

css

:root {

font-family: sans-serif;

}

body {

background-color: #262626;

}

ol {

margin: 0;

list-style: none;

padding: 0;

--hue: 1;

--unit: 1rem;

}

h1 {

text-align: center;

}

p {

line-height: 1.3;

}

.event-date {

margin: 0 0 0.25rem;

font-weight: bold;

}

.event-description {

margin: 0;

}

li {

--height: 7rem;

position: relative;

display: block;

background-color: hsl(calc(var(--hue)*360/20),90%,65%);

border-color: hsl(calc(var(--hue)*360/20),90%,65%);

padding: 1rem;

margin: 2rem 0;

}

li::before {

content: "";

background-color: inherit;

position: absolute;

display: block;

width: var(--unit);

height: var(--unit);

top: 100%;

left: calc(50% - (var(--unit)/2));

}

li::after {

content: "";

position: absolute;

display: block;

top: calc(100% + var(--unit));

left: calc(50% - (var(--unit)));

border: var(--unit) solid transparent;

border-top-color: inherit;

}

li:last-child::before,

li:last-child::after {

content: none;

}

li:nth-child(20n+1){

--hue: 1;

}

li:nth-child(20n+2){

--hue: 2;

}

li:nth-child(20n+3){

--hue: 3;

}

li:nth-child(20n+4){

--hue: 4;

}

li:nth-child(20n+5){

--hue: 5;

}

li:nth-child(20n+6){

--hue: 6;

}

li:nth-child(20n+7){

--hue: 7;

}

li:nth-child(20n+8){

--hue: 8;

}

li:nth-child(20n+9){

--hue: 9;

}

li:nth-child(20n+10){

--hue: 10;

}

li:nth-child(20n+11){

--hue: 11;

}

li:nth-child(20n+12){

--hue: 12;

}

li:nth-child(20n+13){

--hue: 13;

}

li:nth-child(20n+14){

--hue: 14;

}

li:nth-child(20n+15){

--hue: 15;

}

li:nth-child(20n+16){

--hue: 16;

}

li:nth-child(20n+17){

--hue: 17;

}

li:nth-child(20n+18){

--hue: 18;

}

li:nth-child(20n+19){

--hue: 19;

}

li:nth-child(20n+20){

--hue: 20;

}

@media (min-width: 550px) and (max-width: 899px){

li {

margin: 1rem;

width: calc(50% - 4rem);

float: left;

min-height: var(--height);

}

li:nth-child(4n+3),

li:nth-child(4n+4) {

float: right;

}

li:nth-child(4n+1)::before {

top: calc(var(--height)/2 + var(--unit)/2);

left: 100%;

}

li:nth-child(4n+1)::after {

top: calc(var(--height)/2);

left: calc(100% + (var(--unit)));

border: var(--unit) solid transparent;

border-left-color: inherit;

}

li:nth-child(4n+3)::before {

top: calc(var(--height)/2 + var(--unit)/2);

left: -1rem;

}

li:nth-child(4n+3)::after {

top: calc(var(--height)/2);

left: -3rem;

border: var(--unit) solid transparent;

border-right-color: inherit;

}

}

@media (min-width: 900px) and (max-width: 1199px){

li {

margin: 1rem;

width: calc(33.33% - 4rem);

float: left;

min-height: 7rem;

}

li:nth-child(6n+4),

li:nth-child(6n+5),

li:nth-child(6n+6) {

float: right;

}

li:nth-child(6n+1)::before,

li:nth-child(6n+2)::before {

top: calc(var(--height)/2 + var(--unit)/2);

left: 100%;

}

li:nth-child(6n+1)::after,

li:nth-child(6n+2)::after {

top: 3.5rem;

left: calc(100% + (var(--unit)));

border: var(--unit) solid transparent;

border-left-color: inherit;

}

li:nth-child(6n+4)::before,

li:nth-child(6n+5)::before{

top: calc(var(--height)/2 + var(--unit)/2);

left: -1rem;

}

li:nth-child(6n+4)::after,

li:nth-child(6n+5)::after{

top: calc(var(--height)/2);

left: -3rem;

border: var(--unit) solid transparent;

border-right-color: inherit;

}

}

@media (min-width: 1200px){

ol {

max-width: 1600px;

margin: 0 auto;

}

li {

margin: 1rem;

width: calc(25% - 4rem);

float: left;

min-height: 7rem;

}

li:nth-child(8n+5),

li:nth-child(8n+6),

li:nth-child(8n+7),

li:nth-child(8n+8){

float: right;

}

li:nth-child(8n+1)::before,

li:nth-child(8n+2)::before,

li:nth-child(8n+3)::before{

top: calc(var(--height)/2 + var(--unit)/2);

left: 100%;

}

li:nth-child(8n+1)::after,

li:nth-child(8n+2)::after,

li:nth-child(8n+3)::after{

top: calc(var(--height)/2);

left: calc(100% + (var(--unit)));

border: var(--unit) solid transparent;

border-left-color: inherit;

}

li:nth-child(8n+5)::before,

li:nth-child(8n+6)::before,

li:nth-child(8n+7)::before {

top: calc(var(--height)/2 + var(--unit)/2);

left: -1rem;

}

li:nth-child(8n+5)::after,

li:nth-child(8n+6)::after,

li:nth-child(8n+7)::after {

top: calc(var(--height)/2);

left: -3rem;

border: var(--unit) solid transparent;

border-right-color: inherit;

}

}

JavaScript