728x90 반응형 preserve-3d2 비주얼 스튜디오 코드 65_파노라마 회사 소개 1. 배경 - 영상 넣기 글꼴넣기 다른방법으로 폰트 넣기 font : 17px 1.4(줄간격) 폰트종류 body css편집 wrap에서 fixed 하기 object-fit: cover; 비율 맞추기 html 마크업 #circle css 편집 #circle 3d효과 지정 #circle html 세부 마크업 #circle article css 편집 위치 정하기 #circle html 세부 마크업2 #circle article h2 css 편집 #circle article .inner css 편집 article 숨겨주기 div 하나하나 편집해준다. face1 부터 편집 face1 html 마크업 div 6개가 필요하다. 폰트어썸 이미지를 넣어야하기 때문에 폰트어썸 링크를 걸어주자 i태그 밖에 p태그를 추가해준.. 2023. 7. 5. 비주얼 스튜디오 코드 30 _ 마우스오버 효과 ⑤ 원근감을 이용한 회전효과 html 골격만들기 >css figure라는 공통된 태그를 넣어주면 명령어를 줄여서 쓸수 있다. ● perspective : 투시점 , 부모에게 적용해야함 left 가 기준점(relative)이고 figcaption 수정하기 figcaption에 translateZ를 추가해서 이미지와 피그캡션을 z축으로 띄어준다. left 이미지 효과주기 .front , .back 에 transform-style 넣어준다, ● transform-style : preserve-3d > 3d로 사용하겠다. 아래에 #wrap .left .front{} 하나 더 만들어준다. transform: rotateY / 시간값 / backface-visibility: hidden 적용 #wrap .left:ho.. 2023. 6. 14. 이전 1 다음 728x90
