본문 바로가기
반응형

CSS20

[웹프로그래밍 실습] 부트스트랩을 이용한 웹페이지 만들기 부트스트렙을 이용한 웹페이지 만들기 부트스트랩을 이용해서 화면 크기에 따라 웹페이지를 유동적으로 만들었습니다. 스크린 크기가 >= 992px일 때 스크린 크기가 992px 이상일 때는 아래와 같은 구조를 따릅니다. 수업개요: 수업운영 방식 = 5 : 7 (아래 그림이 잘못 나왔습니다.) 사용하는 기술 소개 : 참고사이트 : 선호도 조사 = 5 : 4 : 3 스크린 크기 >= 768px일 때 스크린 크기가 768px이상일 때 다음과 같은 스크린 구조가 나옵니다. 수업개요 = 수업운영방식 = 사용하는 기술소개 = 스크린 전체 너비 참고사이트 : 선호도 조사 = 1 : 1 스크린 크기 2023. 10. 22.
[웹프로그래밍 실습] html, css로 간단한 웹 페이지 만들기 간단한 웹페이지 만들기 작성 코드 html 교과목 개요 수업개요 본 수업에서는 클라이언트 웹 기술인 HTML5, CSS3,Javascript와 서버 기술인 PHP등 웹 프로그래밍과 관련된 기술을 이해한다. 그리고 실습을 통해 웹 사이트 또는 웹 앱을 구현해 봄으로써 최신 웹 표준기술을 습득한다. 수업운영방식 대면 수업으로 함 학교 사이버 캠퍼스를 통한 모든 강의 동영상, 슬라이드, 공지 사항 제공 Flipped Learing 방식 이론 수업 전 예습 : 이론 강의 동영상을 통해 예습 이론 수업 : 그룹 중심의 토론 및 문제 해결 실습 수업 : 개별적으로 실습 과제 해결 관련 기술 소개 분류 클라이언트 웹기술 서버 기술 HTML CSS PHP 이미지 관련문서 HTML5 스팩 CSS3스펙 PHP 메뉴얼 참고.. 2023. 10. 21.
[웹프로그래밍 실습] Dom을 이용한 할 일 입력 요구 버튼 만들기 문제 다음은 문제의 초기 상태이다. 텍스트를 입력하고 '추가' 버튼을 클릭하면 아래와 같이 1,2,3 숫자번호가 있는 리스트가 생성이 된다. 텍스트 옆에는 '하위 할 일 추가' 버튼이 생성이 되며 버튼을 누를 경우 prompt가 생성이 되고 입력된 prompt 값이 텍스트의 순서 있는('A, B, C') 하위 리스트로 들어오게 된다. 만약 텍스트의 하위 리스트 요소를 지우려면 빨간색 네모칸에 있는 텍스트만을 클릭해야 삭제가 된다. 2023. 10. 12.
[JavaScript] HTML - DOM, getElementById, getElementsByTagName, getElementsByClassName HTML DOM( Document Object Model) 웹 페이지를 로드할 때 브라우저는 DOM(Document Object Model) 모델을 만든다. HTML DOM의 경우 객체의 트리형식으로 만들어져 있다. 위의 그림을 차근차근 설명하면 처음에 문서에서 시작하여 시작 요소 하위 요소에는 와 가 존재하며 하위에는 이 이것의 하위 텍스트는 "Mytitle"이 존재한다. 마찬가지로 의 하위에는 와 이 하위요소로 있으며 의 경우 속성이 "href"가 된다. DOM 사용하는 이유? 객체 모델(DOM)을 통해 JavaScript의 필요한 기능을 얻을 수 있다. 자바스크립트 페이지 안에서 HTML 요소를 바꿀 수 있다. 자바스크립트 페이지 안에서 HTML 속성을 바꿀 수 있다. 자바스크립트 페이지 안에서 C.. 2023. 10. 5.
728x90
반응형