Hello 100A

평상시 작업할때 자주 쓰는 버튼 마우스 오버 css 스타일입니다. 전체 html은 간단히 이렇게 작업했습니다. 버튼디자인 버튼타입1 버튼타입2 버튼타입3 버튼 1번은 간단히 배경색이 바뀌는 css입니다. transtion은 background를 넣었습니다.btn1{ position:relative; display:inline-block; background:rgb(26, 115, 232); padding:10px 20px; color:#fff; cursor:pointer; transition:background .4s; } .btn1:hover{ background:#5AAEFF; } 버튼 2번은 마우스 오버시에 progress bar스타일로 게이지바가 채워지듯이 배경색이 변경됩니다..btn2{ posi..

사이드바 모바일이나 반응형 웹에서 자주 사용하는 사이드바입니다. 사이드바는 css 만으로 동작이 되니 사이드바만 사용시에는 js파일이 없으셔도 됩니다. 아코디언메뉴는 jquery로 작업했으며 1.4.4로 작업했습니다. 사이드바 width는 70%이며 사이즈 변경시에는 .sidebar 에서 width와 left 값 둘다 변경하셔야합니다 html코드입니다. HELLO hello1 hello2 hello3 hello4 hello5 hello6 GOODBYE bye1 bye2 bye3 GOODNIGHT goodnight1 goodnight2 goodnight3 css코드입니다. .content{height:100vh; background:#ccc; margin:0 auto; position:relative;} ..