반응형
#inspired_wrap{
width:100%;
position:relative;
height:670px;
background-color: lightseagreen;
}
#inspired_box{
width:1400px;
height:575px;
margin:0 auto;
padding: 96px 32px;
position: absolute;
box-sizing: border-box;
left:50%;
transform: translateX(-50%);
white-space: nowrap;
}
white space: nowrap; 기능을하면 박스 안에 contents 가 그대로 박스 밖까지 나옴
nowrap 2가지있는데
1.
position dipplay block 형태로 레이아웃을 짤때
white-space :nowrap 을 통해서 떨구는것을 방지하는 방법있음
2. display:flex; 를 준 경우
display:flex;
flex-wrap:nowrap
->
display
width:200px; 50px;
50px 50px 6개.
animation hover 시 잠시 멈추고 싶을 때
.inspired_moving:hover{
animation-play-state: paused;
}
아주 유용 !!
프로그래머스 코딩 테스트 해보기
반응형
'블록체인 기반 핀테크 및 응용 SW개발자 양성과정 일기' 카테고리의 다른 글
[21일차 연습] (0) | 2021.04.13 |
---|---|
[21일차] 20210412 반응형, 알고리즘, 재귀함수 등 (0) | 2021.04.12 |
[19일차] 20210408 fiverr웹사이트 만들기 (inspired 만 남음) (0) | 2021.04.08 |
[18일차]20210407 fiverr 웹사이트 만들기 (scroll스크롤 이벤트, font 폰트 바꾸기 ) (0) | 2021.04.07 |
[17일차] 20210406 fiverr웹페이지 만들기 (0) | 2021.04.06 |