본문 바로가기
웹 프로그래밍(풀스택-->java)/웹프로그래밍(프론트엔드-->java)

10. 마우스 오버효과2

by 백엔드개발자0107 2021. 12. 26.

1. margin-top

margin-top과 top의 차이는 margin-top은 그 블록을 영역을 늘리는 것이다.(전체비율도 같이 늘어난다.)

 

 

2. top:

Top 속성은 static position을 제외한 이외의 position의 각 옵션 속성들의 부모 태그를 기준으로 수직으로 위치를 조정할 수 있게 해주는 속성이다. top에 주어지는 값에 따른 각 자식 태그들의 수직이동을 살펴보도록 하자.


3. float: left

난 float:left가 display:block일 떄만 적용이 되는 줄 알았지만, 그게 아니었다.

.notice hover2 ul{overflow:hidden;}
.notice_hover2 li{float:left; width:93px;}
 
li는 inline인 데도 해당이 되더라.!
 
4. margin-right: -1px
 
줄 두줄을 한줄로 보이게 한다.