Commit @14536a5f9c7618e2db4a44c2fc39f0c2c395cfaf - roakfwk30/2022단기집중

안효원 2022-01-20

section3 complete

@14536a5f9c7618e2db4a44c2fc39f0c2c395cfaf

14536a5

vscode/float/images/banner1.png (Binary) (added)

+++ vscode/float/images/banner1.png

Binary file is not shown

14536a5

vscode/float/images/banner2.png (Binary) (added)

+++ vscode/float/images/banner2.png

Binary file is not shown

14536a5

vscode/float/images/banner3.png (Binary) (added)

+++ vscode/float/images/banner3.png

Binary file is not shown

da7ea4c

14536a5

vscode/float/index.html

--- vscode/float/index.html

+++ vscode/float/index.html

...	...	@@ -95,19 +95,19 @@
95	95	<div class="board_content">
96	96	<ul>
97	97	<li>
98		- <a href="#">2월 교육일정 안내</a>
	98	+ <a href="#">ㆍ 2월 교육일정 안내</a>
99	99	<span>2022-01-20</span>
100	100	</li>
101	101	<li>
102		- <a href="#">UI/UX 웹퍼블리셔 양성과정...</a>
	102	+ <a href="#">ㆍ UI/UX 웹퍼블리셔 양성...</a>
103	103	<span>2022-01-20</span>
104	104	</li>
105	105	<li>
106		- <a href="#">아두이노와 자바를 활용한...</a>
	106	+ <a href="#">ㆍ 아두이노 자바를 활용한...</a>
107	107	<span>2022-01-20</span>
108	108	</li>
109	109	<li>
110		- <a href="#">일반고 특화 직업능력개발...</a>
	110	+ <a href="#">ㆍ 일반 특화 직업능력개발...</a>
111	111	<span>2022-01-20</span>
112	112	</li>
113	113	</ul>
...	...	@@ -122,19 +122,19 @@
122	122	<div class="board_content">
123	123	<ul>
124	124	<li>
125		- <a href="#">원서접수 양식...</a>
	125	+ <a href="#">ㆍ 원서접수 양식...</a>
126	126	<span>2022-01-20</span>
127	127	</li>
128	128	<li>
129		- <a href="#">세무/회계/ERP 교육과정...</a>
	129	+ <a href="#">ㆍ 세무/회계/ERP 교육과정...</a>
130	130	<span>2022-01-20</span>
131	131	</li>
132	132	<li>
133		- <a href="#">전기/전자/통신 교육과...</a>
	133	+ <a href="#">ㆍ 전기/전자/통신 교육과...</a>
134	134	<span>2022-01-20</span>
135	135	</li>
136	136	<li>
137		- <a href="#">디자인/영상 교육과정...</a>
	137	+ <a href="#">ㆍ 디자인/영상 교육과정...</a>
138	138	<span>2022-01-20</span>
139	139	</li>
140	140	</ul>
...	...	@@ -147,6 +147,47 @@
147	147	</section>
148	148	<!-- SECTION2 -->
149	149
	150	+ <!-- SECTION3 -->
	151	+ <section id="section3">
	152	+ <div class="wrap">
	153	+ <!-- BANNER AREA -->
	154	+ <div class="area_banner">
	155	+ <div class="box_banner">
	156	+ <a href="#">
	157	+ <img src="images/banner1.png" alt="">
	158	+ </a>
	159	+ </div>
	160	+ <div class="box_banner">
	161	+ <a href="#">
	162	+ <img src="images/banner2.png" alt="">
	163	+ </a>
	164	+ </div>
	165	+ <div class="box_banner">
	166	+ <a href="#">
	167	+ <img src="images/banner3.png" alt="">
	168	+ </a>
	169	+ </div>
	170	+ </div>
	171	+ <!-- BANNER AREA -->
	172	+
	173	+ <!-- SITE MAP -->
	174	+ <div class="area_sitemap">
	175	+ <h3>커뮤니티</h3>
	176	+ <ul>
	177	+ <li><a href="#">공지사항</a></li>
	178	+ <li><a href="#">수상경력</a></li>
	179	+ <li><a href="#">동영상</a></li>
	180	+ <li><a href="#">포토갤러리</a></li>
	181	+ <li><a href="#">수강후기</a></li>
	182	+ <li><a href="#">안효원</a></li>
	183	+ </ul>
	184	+ </div>
	185	+ <!-- SITE MAP -->
	186	+ </div>
	187	+ </section>
	188	+ <!-- SECTION3 -->
	189	+
	190	+
150	191	</main>
151	192	<!-- MAIN -->
152	193
...	...	@@ -162,3 +203,4 @@
162	203
163	204
164	205
	206	+

da7ea4c

14536a5

vscode/float/main.css

--- vscode/float/main.css

+++ vscode/float/main.css


     background-color: #ff944c;
 }
 
+/* SECTION2 */
 .board_box {
     width: 46%;
     margin-right: 4%;

     font-size: 0.8rem;
 }
 .board_title {
+    width: 100%;
     font-size: 1.5rem;
-    border-bottom: 2px solid #005BAA;
-    margin-bottom: 10px;
-    padding-bottom: 5px;
+    border-bottom: 3px solid #005BAA;
+    margin-bottom: 5%;
+    padding-bottom: 2%;
 }
 
 .board_title a{
     float: right;
     color: #005BAA;
-    font-size: 13px;
+    font-size: 0.8rem;
     position: relative;
     top: 15px;
 }
 
 .board_content ul li {
-    margin-bottom: 6px;
+    line-height: 22px;
+    background-image: url("https://www.icqa.or.kr/images/cn/bullet1.png") no-repeat left center;
+}
+
+#section2 .board_content li:nth-child(odd) {
+    background-color: #e8e6ee;
 }
 
 .board_content ul li a {
     font-weight: 600;
 }
 
+.board_content ul li a:hover{
+    color: #444
+}
+
 .board_content ul li span {
     float: right;
+    color: grey;
 }
 
 #board_pds {
     margin-right: 0;
 }
 
+/* SECTION3 */
+#section3 {
+    background-color: #eee;
+    padding: 20px 0;
+}
+
+#section3 .area_banner:after {
+    display: block;
+    clear: both;
+    content: '';
+}
+
+#section3 .box_banner {
+    float: left;
+}
+
+#section3 .box_banner:nth-child(1) {
+    margin-right: 1.5%;
+}
+
+#section3 .box_banner:nth-child(3) {
+    margin-left: 1.5%;
+}
+
+#section3 .area_sitemap {
+    width: 98.8%;
+    margin-top: 10px;
+    background-color: #fff;
+    border: 1px solid #ddd;
+    height: 67px;    
+}
+
+#section3 .area_sitemap h3 {
+    float: left;
+    background-color: #3363c8;
+    color: #fff;
+    font-weight: 600;
+    padding: 20px 0;
+    width: 13%;
+    text-align: center;
+}
+
+#section3 .area_sitemap ul {
+    float: left;
+    width: 87%;
+    padding: 22px 1%;
+}
+
+#section3 .area_sitemap ul li {
+    display: inline-block;
+    width: 15%;
+    text-align: center;
+    background-image: url("https://www.icqa.or.kr/images/cn/box3_4.png") no-repeat left center;
+}
+
+#section3 .area_sitemap ul li a {
+    font-weight: 600;
+}
+
+#section3 .area_sitemap ul li a:hover {
+    color: tomato;
+}
+
+
+
+
+
+
+
+
+
+
 

Add a comment

Open 0
Closed 0

List

...	...	@@ -217,6 +217,7 @@
217	217	background-color: #ff944c;
218	218	}
219	219
	220	+/* SECTION2 */
220	221	.board_box {
221	222	width: 46%;
222	223	margin-right: 4%;
...	...	@@ -224,34 +225,117 @@
224	225	font-size: 0.8rem;
225	226	}
226	227	.board_title {
	228	+ width: 100%;
227	229	font-size: 1.5rem;
228		- border-bottom: 2px solid #005BAA;
229		- margin-bottom: 10px;
230		- padding-bottom: 5px;
	230	+ border-bottom: 3px solid #005BAA;
	231	+ margin-bottom: 5%;
	232	+ padding-bottom: 2%;
231	233	}
232	234
233	235	.board_title a{
234	236	float: right;
235	237	color: #005BAA;
236		- font-size: 13px;
	238	+ font-size: 0.8rem;
237	239	position: relative;
238	240	top: 15px;
239	241	}
240	242
241	243	.board_content ul li {
242		- margin-bottom: 6px;
	244	+ line-height: 22px;
	245	+ background-image: url("https://www.icqa.or.kr/images/cn/bullet1.png") no-repeat left center;
	246	+}
	247	+
	248	+#section2 .board_content li:nth-child(odd) {
	249	+ background-color: #e8e6ee;
243	250	}
244	251
245	252	.board_content ul li a {
246	253	font-weight: 600;
247	254	}
248	255
	256	+.board_content ul li a:hover{
	257	+ color: #444
	258	+}
	259	+
249	260	.board_content ul li span {
250	261	float: right;
	262	+ color: grey;
251	263	}
252	264
253	265	#board_pds {
254	266	margin-right: 0;
255	267	}
256	268
	269	+/* SECTION3 */
	270	+#section3 {
	271	+ background-color: #eee;
	272	+ padding: 20px 0;
	273	+}
	274	+
	275	+#section3 .area_banner:after {
	276	+ display: block;
	277	+ clear: both;
	278	+ content: '';
	279	+}
	280	+
	281	+#section3 .box_banner {
	282	+ float: left;
	283	+}
	284	+
	285	+#section3 .box_banner:nth-child(1) {
	286	+ margin-right: 1.5%;
	287	+}
	288	+
	289	+#section3 .box_banner:nth-child(3) {
	290	+ margin-left: 1.5%;
	291	+}
	292	+
	293	+#section3 .area_sitemap {
	294	+ width: 98.8%;
	295	+ margin-top: 10px;
	296	+ background-color: #fff;
	297	+ border: 1px solid #ddd;
	298	+ height: 67px;
	299	+}
	300	+
	301	+#section3 .area_sitemap h3 {
	302	+ float: left;
	303	+ background-color: #3363c8;
	304	+ color: #fff;
	305	+ font-weight: 600;
	306	+ padding: 20px 0;
	307	+ width: 13%;
	308	+ text-align: center;
	309	+}
	310	+
	311	+#section3 .area_sitemap ul {
	312	+ float: left;
	313	+ width: 87%;
	314	+ padding: 22px 1%;
	315	+}
	316	+
	317	+#section3 .area_sitemap ul li {
	318	+ display: inline-block;
	319	+ width: 15%;
	320	+ text-align: center;
	321	+ background-image: url("https://www.icqa.or.kr/images/cn/box3_4.png") no-repeat left center;
	322	+}
	323	+
	324	+#section3 .area_sitemap ul li a {
	325	+ font-weight: 600;
	326	+}
	327	+
	328	+#section3 .area_sitemap ul li a:hover {
	329	+ color: tomato;
	330	+}
	331	+
	332	+
	333	+
	334	+
	335	+
	336	+
	337	+
	338	+
	339	+
	340	+
257	341

Delete comment