728x90
반응형

NAV 2

비주얼 스튜디오 코드 59_하이시네마 웹페이지 만들기

● 파비콘 링크하기 header 영역 html 마크업 h1 > a > em / strong 마크업 nav 마크업 (nav 두개 만들예정 , pc네비게이션, 모바일 네비게이션) css편집 #header .container .row 모바일 네비게이션 편집 #mNav 편집 .ham span 편집 .ham span 가상요소 만들기 #mNav display:none; 숨겨놓기 반응형 로고 만들기 .header .logo 편집 .nav (pc버전)편집 nav float 띄우기 > html > header에 clearfix 넣기 반응형 적용하기 media.css 만들기 max-width: 1290px .container max-width: 1024px .header .nav 숨겨주기 햄버거 메뉴 나오게하기 max-w..

비주얼 스튜디오 코드 33 _ 프로필 카드 만들기

피그마에서 이미지 600 x 600 px 사이즈로 만들어서 작업할 폴더에 export하기 css reset 셋팅하기 html 바디안에 section(카드부분)이 들어가야한다. css 에서 편집하기 body: 배경색 넣어주기 ! section 태그 박스 넣어주기 width : 340px 너비값 넣어주고 높이값은 안넣어준다. 하지만 padding 값을 넣어주면 너비값이 지정되어있기 때문에 높이값이 30+30 으로 되서 60px이 지정됨 margin : 50px auto; 는 박스를 가운데 정렬을 해준다. box-shadow: 10px 10px 30px rgba(0,0,0,0.1) > 그림자 투명도 지정해준다. html에 다시 돌아가서 섹션 안에 nav 태그 넣어주기 폰트어썸에서 bar 아이콘 복사해서 nav..

728x90
반응형