UI 만드는 법 1. 미리 디자인 해놓고 숨김 2. 원할 때 JS를 이용해서 보여줌 수업) [codingApple.html] Alert 박스 버튼 [codingApple.css] .alert-box { background: #aba8f4; color: #4646b4; padding: 20px; border-radius: 5px; display: none; } 숙제 : 닫기버튼 기능 개발하기 내 답) [codingApple.html] Alert 박스 open close [codingApple css] .alert-box { background: #aba8f4; color: #4646b4; padding: 20px; border-radius: 5px; display: none; } 유튜브 답) [coding..

[getElementById] https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById Document.getElementById() - Web APIs | MDN The Document method getElementById() returns an Element object representing the element whose id property matches the specified string. Since element IDs are required to be unique if specified, they're a useful way to get access to a specific element quick develope..

폰트사이트) fontawesome cdn.js [index2.html] [style2.css] *{ margin:0; padding:0; box-sizing: border-box; } body{ width: 100%; min-height: 100vh; display: flex; justify-content: center; align-items: center; background-color: #171c3c; } .card{ width: 200px; height: 300px; background-color: #ed4848; position: relative; cursor: pointer; transition: all 0.5s; } .card:hover{ box-shadow: inset 0 0 0 100px ..

[001.html] hello world [002.html] bootstrap은 홈페이지 전체가 12개의 column으로 구성되어 있다고 생각함.(기본적으로) container >> row >> col(3) grid system hello hello hello 총 12개의 column을 4개씩 할당받음 왼쪽은 여백(여백을 지우는 것도 가능) grid system hello hello hello hello hello hello grid system hello hello hello hello hello 여백 없애기) container-fluid 추가 grid system hello hello hello hello hello 6*6*12 grid system hello hello hello hello hell..

(110) [HTML/CSS] Full Screen Landing Page 만들기 (배경 이미지 본문 내용 참고) / 웹코딩 / 실습 - YouTube 참고자료) a href="#" 무엇을 의미? (velog.io)

(110) 텍스트 타이핑 효과 어디까지 만들어봤니?(only css) / HTML+CSS 실습 / 웹 코딩 - YouTube 참고자료) display: flex; html/css flex, flexbox 반응형 웹을 위한 css 레이아웃 속성 정리 기존의 웹페이지를 만들 때 사용하던 올드한 레이아웃 제작방법을 개선하고자 flexbox 가 생겨났다. flex는 flexible의 준말로 유동적인 레이아웃을 손쉽게 만들 수 있다는 의미를 가진다.기본 컨셉 thrillfighter.tistory.com justify-content: center; justify-content - CSS: Cascading Style Sheets | MDN The CSS justify-content property defines ..