2021-1-open-source / BaseBallSimulator

Go to a project
Toggle navigation Toggle navigation pinning
정주희
4cdcab3d 1 parent 68b5746d

html_css_updated

Inline Side-by-side
Showing 9 changed files with 641 additions and 24 deletions
1 +body{
2 + background-image:url(https://t1.daumcdn.net/cfile/blog/155A204A5026656D0E);
3 + background-repeat: no-repeat;
4 + background-size: cover;
5 +}
6 +.container1{
7 + display:flex;
8 + justify-content: center;
9 + align-items: baseline;
10 + padding:50px 0px 0px 0px;
11 +}
12 +.logo{
13 + font-size:40px;
14 + color:white;
15 +}
16 +*{
17 + margin: 0;
18 + padding: 0;
19 + box-sizing: border-box;
20 + font-family: sans-serif;
21 +}
22 +
23 +#menu{
24 + margin:60px 250px 0px 250px;
25 + height:90px;
26 + width:1000px;
27 +}
28 +#menu ul li{
29 + list-style:none;
30 + color:white;
31 + background-color:#011638;
32 + float:left;
33 + line-height:30px;
34 + vertical-align:middle;
35 + text-align:center;
36 + display:inline;
37 +}
38 +#menu .me{
39 + text-decoration:none;
40 + color:white;
41 + display:inline-block;
42 + width:250px;
43 + font-size:20px;
44 + font-weight:bold;
45 + font-family: "Trebuchet MS", Dotum, Arial;
46 +}
47 +#menu .me:hover{
48 + color:#D499B9;
49 + background-color: #2E294E;
50 +}
51 +
52 +.row{
53 + display:flex;
54 + justify-content: space-evenly;
55 + padding: 0px 0px 50px 0px;
56 +}
1 +<!DOCTYPE html>
2 +<html>
3 +<head>
4 + <title> Calendar </title>
5 + <link rel="stylesheet" type="text/css"href="calendar.css">
6 +</head>
7 +<body>
8 + <div class="container1">
9 + <span class="logo">Welcome to Baseball Simulator</span>
10 + </div>
11 + <nav id="menu">
12 + <ul>
13 + <li>
14 + <a class="me" href="main.html">Home</a>
15 + </li>
16 + <li>
17 + <a class="me" href="introduction.html">Introduction</a>
18 + </li>
19 + <li>
20 + <a class="me" href="calendar.html">Calendar</a>
21 + </li>
22 + <li>
23 + <a class="me" href="simulation.html">Simulation</a>
24 + </li>
25 + </ul>
26 + </nav>
27 + <div class="container2">
28 + <div class="row row1">
29 + <span class="item1">
30 + <a href="http://www.statiz.co.kr/team.php?opt=0&sopt=1&year=2021&team=%EC%82%BC%EC%84%B1">
31 + <img src="pngs/samsung.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
32 + </a>
33 + </span>
34 + <span class="item2">
35 + <a href="http://www.statiz.co.kr/team.php?opt=0&sopt=1&year=2021&team=NC">
36 + <img src="pngs/nc.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
37 + </a>
38 + </span>
39 + <span class="item3">
40 + <a href="http://www.statiz.co.kr/team.php?opt=0&sopt=1&year=2021&team=LG">
41 + <img src="pngs/LG.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
42 + </a>
43 + </span>
44 + <span class="item4">
45 + <a href="http://www.statiz.co.kr/team.php?opt=0&sopt=1&year=2021&team=KT">
46 + <img src="pngs/kt.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
47 + </a>
48 + </span>
49 + <span class="item5">
50 + <a href="http://www.statiz.co.kr/team.php?opt=0&sopt=1&year=2021&team=SSG">
51 + <img src="pngs/ssg.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
52 + </a>
53 + </span>
54 + </div>
55 + <div class="row row2">
56 + <span class="item6">
57 + <a href="http://www.statiz.co.kr/team.php?cteam=%EB%91%90%EC%82%B0%2BOB&year=2021&opt=0&sopt=1">
58 + <img src="pngs/dusan.png" style="display:block; margin:0 auto; width:150px; height:150px;"alt="">
59 + </a>
60 + </span>
61 + <span class="item7">
62 + <a href="http://www.statiz.co.kr/team.php?cteam=%ED%9E%88%EC%96%B4%EB%A1%9C%EC%A6%88&year=2021&opt=0&sopt=1">
63 + <img src="pngs/kiwoom.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
64 + </a>
65 + </span>
66 + <span class="item8">
67 + <a href="http://www.statiz.co.kr/team.php?opt=0&sopt=1&year=2021&team=KIA">
68 + <img src="pngs/kia.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
69 + </a>
70 + </span>
71 + <span class="item9">
72 + <a href="http://www.statiz.co.kr/team.php?cteam=%ED%95%9C%ED%99%94%2B%EB%B9%99%EA%B7%B8%EB%A0%88&year=2021&opt=0&sopt=1">
73 + <img src="pngs/hanhwa.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
74 + </a>
75 + </span>
76 + <span class="item10">
77 + <a href="http://www.statiz.co.kr/team.php?cteam=%EB%A1%AF%EB%8D%B0&year=2021&opt=0&sopt=1">
78 + <img src="pngs/Lotte.png" style="display:block; margin:0 auto; width:150px; height:150px;" alt="">
79 + </a>
80 + </span>
81 + </div>
82 + </div>
83 +</body>
84 +</html>
1 +body{
2 + background-image:url(https://t1.daumcdn.net/cfile/blog/155A204A5026656D0E);
3 + background-repeat: no-repeat;
4 + -webkit-background-size: cover;
5 + -moz-background-size: cover;
6 + -o-background-size: cover;
7 + background-size: cover;
8 +}
9 +.container1{
10 + display:flex;
11 + justify-content: center;
12 + align-items: baseline;
13 + padding:50px 0px 0px 0px;
14 +}
15 +.logo{
16 + font-size:40px;
17 + color:white;
18 +}
19 +*{
20 + margin: 0;
21 + padding: 0;
22 + box-sizing: border-box;
23 + font-family: sans-serif;
24 +}
25 +
26 +#menu{
27 + margin:60px 250px 0px 250px;
28 + height:90px;
29 + width:1000px;
30 +}
31 +#menu ul li{
32 + list-style:none;
33 + color:white;
34 + background-color:#011638;
35 + float:left;
36 + line-height:30px;
37 + vertical-align:middle;
38 + text-align:center;
39 + display:inline;
40 +}
41 +#menu .me{
42 + text-decoration:none;
43 + color:white;
44 + display:inline-block;
45 + width:250px;
46 + font-size:20px;
47 + font-weight:bold;
48 + font-family: "Trebuchet MS", Dotum, Arial;
49 +}
50 +#menu .me:hover{
51 + color:#D499B9;
52 + background-color: #2E294E;
53 +}
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html>
3 +<head>
4 + <title> Introduction </title>
5 + <link rel="stylesheet" type="text/css"href="introduction.css">
6 +</head>
7 +<body>
8 + <div class="container1">
9 + <span class="logo">Welcome to Baseball Simulator</span>
10 + </div>
11 + <nav id="menu">
12 + <ul>
13 + <li>
14 + <a class="me" href="main.html">Home</a>
15 + </li>
16 + <li>
17 + <a class="me" href="introduction.html">Introduction</a>
18 + </li>
19 + <li>
20 + <a class="me" href="calendar.html">Calendar</a>
21 + </li>
22 + <li>
23 + <a class="me" href="simulation.html">Simulation</a>
24 + </li>
25 + </ul>
26 + </nav>
27 +
28 +</body>
29 +</html>
1 +body{
2 + background-image:url(https://t1.daumcdn.net/cfile/blog/155A204A5026656D0E);
3 + background-repeat: no-repeat;
4 + -webkit-background-size: cover;
5 + -moz-background-size: cover;
6 + -o-background-size: cover;
7 + background-size: cover;
8 +}
9 +.container1{
10 + display:flex;
11 + justify-content: center;
12 + align-items: baseline;
13 + padding:50px 0px 0px 0px;
14 +}
15 +.logo{
16 + font-size:40px;
17 + color:white;
18 +}
19 +*{
20 + margin: 0;
21 + padding: 0;
22 + box-sizing: border-box;
23 + font-family: sans-serif;
24 +}
25 +
26 +#menu{
27 + margin:60px 250px 0px 250px;
28 + height:90px;
29 + width:1000px;
30 +}
31 +#menu ul li{
32 + list-style:none;
33 + color:white;
34 + background-color:#011638;
35 + float:left;
36 + line-height:30px;
37 + vertical-align:middle;
38 + text-align:center;
39 + display:inline;
40 +}
41 +#menu .me{
42 + text-decoration:none;
43 + color:white;
44 + display:inline-block;
45 + width:250px;
46 + font-size:20px;
47 + font-weight:bold;
48 + font-family: "Trebuchet MS", Dotum, Arial;
49 +}
50 +#menu .me:hover{
51 + color:#D499B9;
52 + background-color: #2E294E;
53 +}
54 +.container2{
55 + width:50%;
56 + height:600px;
57 + float:left;
58 +}
59 +.container3{
60 + width:50%;
61 + height:200px;
62 + float:left;
63 +}
64 +.container4{
65 + width:20%;
66 + height:400px;
67 + float:left;
68 +}
69 +.container5{
70 + width:30%;
71 + height:400px;
72 + float:left;
73 +}
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 -
4 -
5 <head> 3 <head>
6 <title> Baseball Simulator </title> 4 <title> Baseball Simulator </title>
7 - <span style = "font-size:2.0em; color: white;"><p style="text-align:center;">Welcome to Baseball Simulator</p></span> 5 + <link rel="stylesheet" type="text/css"href="main.css">
8 -
9 -<style>
10 -body{
11 - background-image:url(https://t1.daumcdn.net/cfile/blog/155A204A5026656D0E);
12 - background-repeat: no-repeat;
13 - -webkit-background-size: cover;
14 - -moz-background-size: cover;
15 - -o-background-size: cover;
16 - background-size: cover;
17 -
18 -}
19 -</style>
20 </head> 6 </head>
21 - <body> 7 +<body>
22 - 8 + <div class="container1">
23 - <input type = "button" name = "go to sim" value = "GO Simulator"> 9 + <span class="logo">Welcome to Baseball Simulator</span>
24 - <input type = "button" name = "go to cal" value = "GO Calendar"> 10 + </div>
25 - 11 + <nav id="menu">
12 + <ul>
13 + <li>
14 + <a class="me" href="main.html">Home</a>
15 + </li>
16 + <li>
17 + <a class="me" href="introduction.html">Introduction</a>
18 + </li>
19 + <li>
20 + <a class="me" href="calendar.html">Calendar</a>
21 + </li>
22 + <li>
23 + <a class="me" href="simulation.html">Simulation</a>
24 + </li>
25 + </ul>
26 + </nav>
27 + <div class="container2">
28 + <a href="https://sports.news.naver.com/kbaseball/record/index.nhn?category=kbo&year=2021"><img src="pngs/rank.jpg" style="display:block; margin:0 auto; width:600px; height:400px;"></a>
29 + </div>
30 + <div class="container3">
31 + <a href="https://sports.news.naver.com/kbaseball/schedule/index.nhn"><img src="pngs/today.jpg" style="display:block; margin:0 auto; width:655px; height:150px;"></a>
32 + </div>
33 + <div class="container4">
34 + <img src="pngs/1.jpg" style="display:block; margin:0 auto; width:200px; height:100px;">
35 + </div>
36 + <div class="container5">
37 + <iframe width="400" height="200" src="https://www.youtube.com/embed/dL_79KkHmQE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
38 + </div>
26 </body> 39 </body>
27 -
28 -
29 -
30 -</html>
...\ No newline at end of file ...\ No newline at end of file
40 +</html>
......
File mode changed
1 +body{
2 + background-image:url(https://t1.daumcdn.net/cfile/blog/155A204A5026656D0E);
3 + background-repeat: no-repeat;
4 + -webkit-background-size: cover;
5 + -moz-background-size: cover;
6 + -o-background-size: cover;
7 + background-size: cover;
8 +}
9 +.container1{
10 + display:flex;
11 + justify-content: center;
12 + align-items: baseline;
13 + padding:50px 0px 0px 0px;
14 +}
15 +.logo{
16 + font-size:40px;
17 + color:white;
18 +}
19 +*{
20 + margin: 0;
21 + padding: 0;
22 + box-sizing: border-box;
23 + font-family: sans-serif;
24 +}
25 +
26 +#menu{
27 + margin:60px 250px 0px 250px;
28 + height:90px;
29 + width:1000px;
30 +}
31 +#menu ul li{
32 + list-style:none;
33 + color:white;
34 + background-color:#011638;
35 + float:left;
36 + line-height:30px;
37 + vertical-align:middle;
38 + text-align:center;
39 + display:inline;
40 +}
41 +#menu .me{
42 + text-decoration:none;
43 + color:white;
44 + display:inline-block;
45 + width:250px;
46 + font-size:20px;
47 + font-weight:bold;
48 + font-family: "Trebuchet MS", Dotum, Arial;
49 +}
50 +#menu .me:hover{
51 + color:#D499B9;
52 + background-color: #2E294E;
53 +}
54 +.container2{
55 + width:25%;
56 + height:600px;
57 + float:left;
58 +}
59 +.team{
60 + font-size:24px;
61 + color:white;
62 + font-family: sans-serif;
63 + text-align:center;
64 +}
65 +.a{
66 + height:50px;
67 +}
68 +.selection{
69 + padding:0px 10px 15px 10px;
70 + height:80px;
71 +}
72 +.t1{
73 + width:50px;
74 + height:30px;
75 + color: #6AAFE6;
76 + border: 1px solid #6AAFE6;
77 + background: white;
78 + font-size:15px;
79 + border-radius:5px;
80 +}
81 +.row{
82 + display:flex;
83 + justify-content: space-evenly;
84 + padding: 0px 5px 10px 0px;
85 +}
86 +.container3{
87 + width:50%;
88 + height:100%;
89 + float:left;
90 +}
91 +.container4{
92 + width:25%;
93 + height:600px;
94 + float:left;
95 +}
96 +.t2{
97 + width:50px;
98 + height:30px;
99 + color: #6f2108;
100 + border: 1px solid #6f2108;
101 + background: white;
102 + font-size:15px;
103 + border-radius:5px;
104 +}
105 +.l{
106 + width:33%;
107 + height:200px;
108 + float:left;
109 +}
110 +
111 +.vs{
112 + width:200px;
113 + height:200px;
114 +}
115 +#vss{
116 + font-size:40px;
117 + color:white;
118 + text-align:center;
119 +}
120 +.simul{
121 + height:150px;
122 + display:flex;
123 + float:left;
124 + margin-top:50px;
125 + margin-left:250px;
126 +}
127 +.but{
128 + height:150px;
129 + margin: 0px auto;
130 +}
131 +.simulbtr{
132 + width:250px;
133 + height:50px;
134 + color: #c9d6de;
135 + border: 1px solid #c9d6de;
136 + background: black;
137 + font-size:30px;
138 + border-radius:5px;
139 +}
140 +.tb{
141 + padding: 10px 0px 0px 135px;
142 +}
143 +table{
144 + border: 1px solid #444444;
145 + background-color:white;
146 + border-collapse:collapse;
147 +}
148 +td{
149 + border:1px solid #444444;
150 + padding: 10px;
151 +}
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html>
3 +<head>
4 + <title> Simulation </title>
5 + <link rel="stylesheet" type="text/css"href="simulation.css">
6 +</head>
7 +<body>
8 + <div class="container1">
9 + <span class="logo">Welcome to Baseball Simulator</span>
10 + </div>
11 + <nav id="menu">
12 + <ul>
13 + <li>
14 + <a class="me" href="main.html">Home</a>
15 + </li>
16 + <li>
17 + <a class="me" href="introduction.html">Introduction</a>
18 + </li>
19 + <li>
20 + <a class="me" href="calendar.html">Calendar</a>
21 + </li>
22 + <li>
23 + <a class="me" href="simulation.html">Simulation</a>
24 + </li>
25 + </ul>
26 + </nav>
27 + <div class="container2">
28 + <div class="a">
29 + <p class="team">원정팀</p>
30 + </div>
31 + <div class="selection">
32 + <div class="row row1">
33 + <button type="submit" class="t1">삼성</button>
34 + <button type="submit" class="t1">NC</button>
35 + <button type="submit" class="t1">LG</button>
36 + <button type="submit" class="t1">KT</button>
37 + <button type="submit" class="t1">SSG</button>
38 + </div>
39 + <div class="row row2">
40 + <button type="submit" class="t1">두산</button>
41 + <button type="submit" class="t1">키움</button>
42 + <button type="submit" class="t1">KIA</button>
43 + <button type="submit" class="t1">한화</button>
44 + <button type="submit" class="t1">롯데</button>
45 + </div>
46 + </div>
47 + <div class="tb">
48 + <table>
49 + <tbody>
50 + <tr>
51 + <td>1번 타자</td><td>-</td>
52 + </tr>
53 + <tr>
54 + <td>2번 타자</td><td>-</td>
55 + </tr>
56 + <tr>
57 + <td>3번 타자</td><td>-</td>
58 + </tr>
59 + <tr>
60 + <td>4번 타자</td><td>-</td>
61 + </tr>
62 + <tr>
63 + <td>5번 타자</td><td>-</td>
64 + </tr>
65 + <tr>
66 + <td>6번 타자</td><td>-</td>
67 + </tr>
68 + <tr>
69 + <td>7번 타자</td><td>-</td>
70 + </tr>
71 + <tr>
72 + <td>8번 타자</td><td>-</td>
73 + </tr>
74 + <tr>
75 + <td>9번 타자</td><td>-</td>
76 + </tr>
77 + <tr>
78 + <td>선발 투수</td><td>-</td>
79 + </tr>
80 + </tbody>
81 + </table>
82 + </div>
83 + </div>
84 + <div class="container3">
85 + <div class="l">
86 + <img src="pngs/dusan.png" class="vs" style="margin:0px 0px 0px 50px;">
87 + </div>
88 + <div class="l">
89 + <p id="vss">VS</p>
90 + </div>
91 + <div class="l">
92 + <img src="pngs/kia.png" class="vs">
93 + </div>
94 + <div class="simul">
95 + <div class="but">
96 + <button type="submit" class="simulbtr">시뮬레이션</button>
97 + </div>
98 + <div class="result">
99 +
100 + </div>
101 + </div>
102 + </div>
103 + <div class="container4">
104 + <div class="a">
105 + <p class="team">홈팀</p>
106 + </div>
107 + <div class="selection">
108 + <div class="row row1">
109 + <button type="submit" class="t2">삼성</button>
110 + <button type="submit" class="t2">NC</button>
111 + <button type="submit" class="t2">LG</button>
112 + <button type="submit" class="t2">KT</button>
113 + <button type="submit" class="t2">SSG</button>
114 + </div>
115 + <div class="row row2">
116 + <button type="submit" class="t2">두산</button>
117 + <button type="submit" class="t2">키움</button>
118 + <button type="submit" class="t2">KIA</button>
119 + <button type="submit" class="t2">한화</button>
120 + <button type="submit" class="t2">롯데</button>
121 + </div>
122 + </div>
123 + <div class="tb">
124 + <table>
125 + <tbody>
126 + <tr>
127 + <td>1번 타자</td><td>-</td>
128 + </tr>
129 + <tr>
130 + <td>2번 타자</td><td>-</td>
131 + </tr>
132 + <tr>
133 + <td>3번 타자</td><td>-</td>
134 + </tr>
135 + <tr>
136 + <td>4번 타자</td><td>-</td>
137 + </tr>
138 + <tr>
139 + <td>5번 타자</td><td>-</td>
140 + </tr>
141 + <tr>
142 + <td>6번 타자</td><td>-</td>
143 + </tr>
144 + <tr>
145 + <td>7번 타자</td><td>-</td>
146 + </tr>
147 + <tr>
148 + <td>8번 타자</td><td>-</td>
149 + </tr>
150 + <tr>
151 + <td>9번 타자</td><td>-</td>
152 + </tr>
153 + <tr>
154 + <td>선발 투수</td><td>-</td>
155 + </tr>
156 + </tbody>
157 + </table>
158 + </div>
159 + </div>
160 +</body>
161 +</html>