Here Comes the Sun

HTML5

HTML/CSS, Javascript : 2월 7일 HTML/CSS flex:1의 역할[예시 1] .event { display: flex; background: #ff5722; padding: 20px; } [예시 2] .event { display: flex; flex: 1; background: #ff5722; padding: 20px; } 딱 1대 1로 상자 크기를 잡아줌! [예시 3] .event { display: flex; flex: 1; background: #ff5722; padding: 20px; }.event2 { flex: 2;} /* 원랜 필요없는 속성임 */ - div, section 등을 세세하게 구분하는 건 큰 의미없다. 유명한 포털도 기능 구현에 목적을 둠. - 실습과제 홈페이지(티르티르) 따라 만들기 -> 똑같..

HTML/CSS : 2월 6일 Animista - On-Demand CSS Animations LibraryAnimista is a CSS animation library and a place where you can play with a collection of ready-made CSS animations and download only those you will use.animista.net 개발자모드에서 취소선은 우선순위에서 밀려나 적용이 안 된 것임 c_antmation_01.html /* 🎯 7. 크기가 점점 커졌다 작아지는 애니메이션 */ @keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transf..

HTML/CSS : 2월 5일 브라우저에서 자동으로 margin을 지정해줌 => 나중에 html작성할 때 초기화하고 시작 div{ height:100%; background-color: blue }이면 화면에 색이 안 보인다.why? 부모 기준으로 높이를 잡기 때문body { height:100% } 해도 여전히 안 보임html{ height:100%; } 해야 보임why? html -> body -> div라서 in contrast, div { height: 100vh; background-color: blue } 하면 브라우저 영역을 잡아서 보임 # margin.box1 { margin-bottom: 20px; }.box2 { margin-top: 40px; } 인 경우, 숫자가 큰 쪽으로만 처리 => 두 박스 사이 거리는 ..

HTML/CSS : 2월 4일 원래 input으로는 상자안에 커서를 갖다대야 입력할 수 있었는데 label이면 앞에 써있는 텍스트를 눌러도 입력가능 → UX 향상 option value = "apple">사과option>서버에서는 value 값을 가짐(영어 단어를 전송) 내가 만든 코드의 레이아웃을 해치지 않으면서도 디자인 넣고 싶을 때, span 사용 네이버 내부정책 → 서버에서 데이터 제공 안함 iframe 못 씀유튜브도 본인들이 제공하는 주소로만 iframe 제공 https://www.gdweb.co.kr/main/index.asp http://www.gdweb.co.kr www.gdweb.co.kr웹페이지 디자인 수상작들 네이버는 반응형 웹페이지 제공 안 하고 아예 모바일 분리 div class → 웹페이지 중복 가능div ..

HTML/CSS : 2월 3일 시맨틱 태그를 통해 검색 시 나오는 화면을 자동으로 구성가능(일일이 하는 거 아님) 빈 화면에서 ! tab을 누르면 html 기본 구조 나옴viewport -> 모바일에 맞게 웹브라우저가 맞춰줌keywork -> 네이버 엔진이 우리 페이지를 읽을 때 키워드에 맞춰서 찾아 보여줌 태그는 줄바꿈이 적용된 태그임태그는 앞에 공백도 인식함은 스크린리더에서 텍스트를 읽을 때 더 큰소리로 읽거나 중요한 부분으로 취급함 (와 같아 보이지만) 고로 의미적으로 중요하다고 여겨질 때 쓰면 됨. type 안엔 circle 등 다양한 모양 가능의 경우 A나 I등 다양한 형태의 순서 표시 가능 는 이미지 대체 텍스트로 검색엔진이 사진 찾을 때 이용 (필수x, 권장o) 웹 브라우저 개발팀들이 이런 team들이 tag들을 업데이..

이전 1 다음

티스토리툴바