프론트엔드

[2022/01/03]국비지원 CSS3 12 animation

animation : name duration timing-function delay interation-count direction fill-mode play-state steps name : 모션 이름 duration : /s, /ms timing-function : 모션 중 가속도 delay : 지연시간 interation-count : 반복횟수 0% ~ 100% infinite direction : 방향 normal alternate revers fill-mode : 시작 전 후 효과 forwards backwards both none play-state : 실행 상태 paused play steps : frame 수 입력 방식 ex @keyframes ani { 0%{left: 0;border:..

[2021/12/31]국비지원 CSS3 11-(6) 클론코딩 예제: html5헤럴드

원본 작업내용 html HTML5 헤럴드 HTML5 & CSS3를 이용해 옛 신문 스타일을 재현하다 주메뉴 홈 등록 Vol.MMXI June 4, 1904 마지막 미개척지 비디오, 드디어 정복하다! Aliquam erat volutpat. Mauris vel neque sit amet nunc gravida congue sed sit amet purus. Quisque lacus quam, egestas ac tincidunt a, lacinia vel velit. Morbi ac commodo nulla. In condimentum orci id nisl volutpat bibendum. Quisque commodo hendrerit lorem quis egestas. Vivamus rutrum nun..

[2021/12/31]국비지원 CSS3 11-(5) form appearance, outline

★★★★★ 브라우저 식별 접두사 필요한 속성 ★★★★★ appearance : none )) 폼 외관 초기화 브라우저 식별 접두사 없어도 되는 property outline-offset : 외곽선과 border 간격 outline : 외곽선 회원가입양식 form 속성의 고유한 디자인을 초기화 해서 모든 웹브라우저에서 동일하게 보이도록 하는 속성 010 outline은 border영역 외곽에 테두리 치는 속성 결과물

[2021/12/31]국비지원 CSS3 11-(4) 텍스트 설정 etc

text-overflow ellipsis : ... clip : 컷! word-wrap break-word : 길이가 긴 알파벳 단어의 줄바꿈 용도 word-break break-all : 단어 끊기 keep-all : 단어 유지 white-space normal : default 자동 enter nowrap : enter none pre : 연속 공백 유지. 줄바꿈은 수동 입력 pre-wrap : 모든 연속 공백 유지. 한 줄이 너무 길어지면 자동 enter pre-line : 모든 연속되는 공백을 합치며, 한 줄이 너무 길어지면 자동 enter break-spaces pre-wrap과의 차이점 줄 끝에 연속 공백 있는 경우 공간 인정 연속 공백이 있어도 중간, 끝 어디서든 자동 enter elemen..

[2021/12/31]국비지원 CSS3 11-(3) column

신문기사처럼 단 나누기 : column column-count : 단 개수 column-gap : 단 간격 column-rule : 단 구분선 허브란? 라틴어의 "푸른 풀"을 의미하는 Herba에서 출발하며, "잎, 줄기와 뿌리 등이 식용, 약용에 TM이거나 향기나 향미가 이용되는 식물의 총체"라고 할 수 있다. 즉, 잎, 줄기, 뿌리, 꽃 등을 허브의 의미에 포함하며 그 성분이 식품이나 음료속에 보존용 향신료 EH는 건강증진제로서 첨가되는 식물과 식품, 음료 외에 제품에 향수, 화장, 세정의 효과를 기대하여 이용되는 식물의 전부라고 할 수 있다.현재 국내에서 일반적으로 알고 있는 허브에 대한 개념은 외국에서 도입된 식물에 한정지어 생각하는 경우가 대부분이나 사실은 이미 수 천년 전부터 우리 조상들도 생..