9월 30일 개발일지

서진·2021년 9월 29일
0

블로그 메인영역

html


<header id="blog_header">
<div class="blog_header_top">
<div class="blog_container">
<div class="blog_header_left">

<h2><a href="#">블로그</a></h2>
					
<div class="blog_header_input_wrap">				<divclass="blog_search_wrap">
<input type="text">
<button type="button" class="btn_search"></button>
</div>

<button type="button" class="btn_total_search">통합검색</button>
</div></div>
<div class="blog_header_right">
<a href="#" class="btn_login">로그인</a>
<button type="button" class="btn_menu"></button>
</div>
</div>
</div>
<div class="blog_header_nav">
<div class="blog_container">
<nav class="nav_left">
<ul>
<li class="on"><a href="#">블로그 홈</a></li>
<li><a href="#">주제별 보기</a></li>
<li><a href="#">이달의 블로그</a></li>
<li><a href="#">공식 블로그</a></li>
<li><a href="#">챌린지 프로그램</a></li>
</ul></nav>
<nav class="nav_right"><ul>
<li class="on"><a href="#">블로그 마켓 가입</a></li><li><a href="#">아이템 팩토리</a></li>
<li><a href="#">블로그팀 공식블로그</a></li>
</ul>
</nav>
</div>
</div>
</header>

css

#blog-header .blog-header-nav .nav-right ul { 
display: flex;
flex-warp: warp;
justify-content: flex-end;
align-items: center; }

#blog-header .blog-header-nav .nav-right li {
width: auto;
height: 26px;
margin-left: 8px;


#blog-header .blog-header-nav .nav-right li.on a {
background-color: #00c73c;
border: solid 1px rgba(0, 0, 0, 00)
color: #ffffff;


#blog-header .blog-header-nav .nav-right li a {
display: block;
width: 100%;
height: 100%;
background-color: #fffff;
border: 1px solid #cecece;

line-height: 26px;
padding: 0 10px;
font-size: 13px; }


반복학습 해야겠다.
수행평가가 있다보니 정신없이 하루가 빨리 지나가버리는 느낌…
정신차려야겠다…..
















0개의 댓글