Web學習開始。

時間 2019-11-20

標籤 web 學習開始欄目 HTML 简体版

原文原文鏈接

web：結構＋表現＋行爲javascript

W3c標準，學習html，css，javascriptcss

第一個推薦網站html

學習路線java

HTML入門→CSS入門→HTML進階→CSS進階→JavaScript入門→jQuery入門→ASP.NET入門（或PHP入門）→Ajax→ASP.NET進階（或PHP進階）web

記錄好玩好用的代碼：ide

 1 <!DOCTYPE HTML>
 2 <html>
 3     <head>
 4         <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
 5         <title>哈哈哈</title>
 6         <style type="text/css">
 7             body{
 8                 background-image:url('http://ww3.sinaimg.cn/mw690/a03b11abgw1eopcfely0mj20ue0xch41.jpg');}
 9             a,span,em{
10                 background:none;
11                 display:inline-block;
12                 padding:10px;
13                 box-shadow:1px 1px 8px;
14                 border-radius:20px;
15                 transition:background 1s;
16             }
17             a:hover{
18                 background-color:#78CBDD;
19                 border-color:pink;
20                 animation:anime 0.8s;
21             }
22             @keyframes anime
23             {
24                 0% {opacity:0;width:12%;}
25                 50% {opacity:0.8;width:20%;}              100% {opacity:0.8;width:12%;}
26             }
27         </style>
28     </head>
29     <body>
30         <a href="http://www.baidu.com">百度</a>
31         <a href="http://www.imooc.com">幕課網</a>
32         <span>233333</span>
33         <span>6666666</span>
34     </body>
35 </html>

View Code

 1 <!DOCTYPE HTML>
 2 <html>
 3     <head>
 4         <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
 5         <title>哈哈哈</title>
 6         <style type="text/css">
 7             body{
 8                 background-image:url('http://ww3.sinaimg.cn/mw690/a03b11abgw1eopcfely0mj20ue0xch41.jpg');}
 9             a,span,em{
10                 background:none;
11                 display:inline-block;
12                 padding:10px;
13                 box-shadow:1px 1px 8px;
14                 border-radius:20px;
15                 transition:background 1s;
16             }
17             a:hover{
18                 background-color:#78CBDD;
19                 border-color:pink;
20                 animation:anime 0.8s;
21             }
22             @keyframes anime
23             {
24                 0% {opacity:0;width:12%;}
25                 50% {opacity:0.8;width:20%;}              100% {opacity:0.8;width:12%;}
26             }
27             li{
28                 border-bottom:1px dotted #ccc;
29                 width:200px;
30                 padding:20px;
31             }
32         </style>
33     </head>
34     <body>
35         <a href="http://www.baidu.com">百度</a>
36         <a href="http://www.imooc.com">幕課網</a>
37         <ol>
38             <li>別讓不會說話害了你</li>
39             <li>二十七八歲就應該有的見識</li>
40             <li>別讓很差意思害了你</li>
41         </ol>
42     </body>
43 </html>