반응형 HTML6 CSS) Clip-Path 속성으로 물결치는(Wave) 글자 만들기 Clip-Path 속성은 CSS의 일부분을 잘라낼 수 있는 CSS의 속성이다. 마우스 드래그를 통해 Clip-Path 생성하는 사이트: https://bennettfeely.com/clippy/ 예시)See the Pen Untitled by Box Cat (@Box-Cat) on CodePen. 참고)-webkit-text-stroke: ; 는 '텍스트에 윤곽선을 추가하는데 사용'ex) -webkit-text-stroke: 2px #03a9f4;>> 두께가 2px이고, 색깔이 #03a9f4 . 2024. 7. 15. CSS) Clip-Path 속성으로 둘로 쪼개지는 글자 만들기 Clip-Path 속성은 CSS의 일부분을 잘라낼 수 있는 CSS의 속성이다. 마우스 드래그를 통해 Clip-Path 생성하는 사이트: https://bennettfeely.com/clippy/ 예시) loading loading " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 loading loading 2024. 7. 14. CSS)input 태그에서 value와 placeholder의 차이점 공통점: input 태그에 value와 placeholder를 적용하면, input 박스 안에 미리 원하는 문구를 적어 놓을 수 있습니다. 차이점: 단, value 속성은 input 태그의 초깃값으로 사용됩니다. 이 값을 바꾸고 싶다면, 사용자가 직접 지우고 입력해야 합니다. 또 value 속성의 경우, form 태그를 활용해서 서버 쪽으로 정보를 전송할 수 있습니다. 만약 input 태그의 내용을 변경하지 않고 form 태그를 활성화 시키면, 초기의 value 값이 그대로 서버로 전송됩니다. placeholder 속성을 사용하면 사용자가 글자를 입력할 때, 자동으로 미리 입력된 문구가 사라집니다. value와는 달리, 서버 쪽으로 전송되지 않습니다. placeholder는 눈에만 보일 뿐, 실질적인 값.. 2021. 7. 30. CSS) Float 성배 레이아웃 코드(Holy grail layout) header 제목 영역 menu1 menu2 menu3 menu4 menu5 aside 제목영역 section 제목영역 article 제목영역 aritcle 내용 영역 aside 제목영역 footer 내용 2021. 7. 3. CSS) Flex 성배 레이아웃 코드(Holy grail layout) header제목영역 menu1 menu2 menu3 menu4 menu5 section 제목영역 article제목 영역 article내용 영역 article제목 영역 article내용 영역 article제목 영역 article내용 영역 article제목 영역 article내용 영역 article제목 영역 article내용 영역 article제목 영역 article내용 영역 aside 제목영역 로고 회사정보 2021. 7. 3. CSS) Grid(그리드) 성배 레이아웃 코드(Holy grail layout) header 제목영역 menu1 menu2 menu3 menu4 menu5 section 제목영역 article 제목 article 내용 article 제목 article 내용 로고 회사정보 2021. 7. 3. 이전 1 다음 반응형
