목록html (3)

프론트 개발 블로그

강조 태그 <strong>,<b>,<i>,<em>

브라우저에서 굵은 글씨체로 표현 되지만, 다른 의미를 가진 , 태그 : 중요한 내용에 강한 강조를 나타냄 : 특별한 중요도는 주어지지 않으며, 독자의 주의를 끌기 위한 용도로 사용됨. * 순수하게 꾸밈을 위해서는 태그보다 CSS의 속성 font-weight 를 사용. * 과 을 중첩하여 강조의 강조를 증가시키기 위해 사용될 수도 있다. 브라우저에서 기울임 꼴로 표현 되지만, 다른 의미를 가진 , 태그 : 컨텐츠 강조 할 때 사용! 주위 텍스트에 비해 강조된 부분을 나타내며, 한 문장에서 단어 하나 혹은 몇 개로 제한 되며, 문장의 의미에 영향을 미칠 수 있음. : 외국어, 기술 용어, 등장인물의 생각등의 사용! 텍스트에서 어떤 이유로 주위와 구분해야 하는 부분을 나타냄 (보통 표현은 기울임 꼴로 표시됨)..
HTML 2022. 1. 27. 15:43
[Interactive Web] 스크롤 UX 이해하기

[번역] Apple 제품 페이지 스크롤 애니메이션 https://css-tricks.com/lets-make-one-of-those-fancy-scrolling-animations-used-on-apple-product-pages/ 기본 개념 빠르게 연속되는 이미지 시퀀스와 같은 애니메이션을 만드는 것. (플립북같은) 복잡한 WebGL 이나 고급 Javascript 라이브러리가 필요하지 않습니다. 각 프레임을 사용자의 스크롤 위치와 동기화하여 사용자가 페이지를 아래로(또는 위로) 스크롤 할 때 애니메이션을 재생할 수 있습니다. https://res.cloudinary.com/css-tricks/video/upload/v1588889054/flipbook_tisnxf.mp4 마크업과 스타일로 시작하기 HT..
Interactive Web 2021. 8. 20. 15:52
IE에서 가상요소 사용 시 속성이 삭제 되는 현상

input 가상 클래스 ::after 로 디자인 된 체크박스 작업 시 IE에서 가상요소인 ::after 속성을 삭제하는 현상 1 2 3 4 5 6 .apply .agree .input__checkbox {float:left; width:0px; height:0px; margin:-1px; padding:0; border:0; clip:rect(0, 0, 0, 0);} .apply .agree .input__checkbox::after {display:block; content:''; cursor:pointer; display:inline-block; width:30px; height:30px; background:url('../../static/img/ico_agree.png') no-repeat; ba..
CSS 2020. 9. 21. 16:20
이전 Prev 1 Next 다음