FrontEnd & Mobile/HTML & CSS(13)
-
[수코딩] [HTML/CSS] 간단한 Card UI 만들기 / 폰트어썸 / 실습 / 웹 코딩
폰트사이트) 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 ..
2023.01.17 -
[제주코딩베이스캠프] (신) 올 뉴 30분 요약강좌(Bootstrap)
[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 ..
2023.01.16 -
[수코딩] [HTML/CSS] Full Screen Landing Page 만들기 (배경 이미지 본문 내용 참고) / 웹코딩 / 실습
(110) [HTML/CSS] Full Screen Landing Page 만들기 (배경 이미지 본문 내용 참고) / 웹코딩 / 실습 - YouTube 참고자료) a href="#" 무엇을 의미? (velog.io)
2023.01.16 -
[수코딩] 텍스트 타이핑 효과 어디까지 만들어봤니?(only css) / HTML+CSS 실습 / 웹 코딩
(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 | MDNThe CSS justify-content property defines ..
2023.01.16 -
PHP란?(자바스크립트와 차이)
웹 페이지 프로그래밍 언어에는 Javascript와 PHP등이 있다. Javascript는 클라이언트 측 스크립트이고, PHP는 서버 측 스크립트라고 생각하면 된다. 웹 브라우저는 서버에서 내려받은 내용을 사용자(클라이언트)에게 보여주는 역할을 한다. PHP는 서버 측 스크립트이다. PHP 프로그램은 내려받기 전에 웹 서버에서 실행된다. 웹 브라우저에 내려받은 코드는 프로그램이 실행된 HTML코드이다. 내려받은 HTML코드에는 PHP 프로그램 코드가 포함되어 있지 않다. 그리고 PHP는 MySQL과 연동으로 사용하기에 주로 블로그, sns, 쇼핑몰, 일정관리 등을 만들 때 많이 사용된다. PHP(서버 측 스크립트) PHP는 서버 측 스크립트이다. PHP를 내려받기 전에 웹서버에서 실행이 먼저 된다. 웹브..
2022.12.30 -
[비전공자를 위한 첫 코딩 챌린지 with HTML&CSS] 06 코딩 맛보기
[Hello world 출력하기] 내가 작성한 답) Hello world 책에 있는 답) Hello world 사용 가능한 것) 책에서는 문장이라 보기 어렵기 때문에 p 태그 대신 span 태그 사용 [나만의 폼 만들기] 내가 작성한 코드) My Form Username : Password : I'm not a robot. 책에서는 크게 으로 나눔 : 여러 소스 묶기 : 사용자 인터페이스(UI) 요소의 라벨(label)을 정의할 때 사용한다. for 속성을 사용하여 다른 요소와 결합ㄹ할 수 있으며, 이때 요소의 for 속성값은 결합하고자 하는 요소의 id 속성값과 같아야 한다. 또한 요소를 결합하고자 하는 요소 내부에 위치시키면 for 속성을 사용하지 않더라도 해당 요소와 결합시킬 수 있다. ex) 1...
2022.12.30