본문 바로가기

대학강의정리/22.1 웹프로그래밍기초13

2. html5 기본태그 중 목록태그 내비게이션 메뉴를 만들때 주로 사용했다. 최근에 만들어진 웹페이지들은 잘 사용하지 않는다. 1. li : ol과 ul에 감싸지는 리스트(목록 요소), 내용 2. ul : unordered list, · 으로 표시 3. ol : ordered list, 1. 2. 3. 으로 표시 2022. 4. 19.
2. html5 기본태그 중 글자태그 학습목표 글자 태그, 목록 태그, 테이블 태그, 미디어 태그; html5에서 지원하는 기본 태그를 사용할 수 있습니다. 글자 태그 태그나 p, br, hr 과 같은 태그를 사용하지 않고 body에 그냥 텍스트를 집어넣어도 텍스트가 출력된다. 1. 제목과 본문 1) 제목 태그 h1 ~ h6 : margin-top과 margin-bottom이 정해져 있음 h1 h2 h3 h4 h5 h6 h1 { display: block; font-size: 2em; margin-top: 0.67em; margin-bottom: 0.67em; margin-left: 0; margin-right: 0; font-weight: bold; } h2 { display: block; font-size: 1.5em; margin-to.. 2022. 4. 19.
1. 웹 디버깅하기 1. css 디버깅 css 기본값을 보여주는 사이트 https://www.w3schools.com/cssref/css_default_values.asp 2. 초보자가 할만한 간단한 실수, 체크리스트 코드가 적용되지 않을때(오류가 난 것으로 의심될때) 코드가 저장되었나([ctrl+s]를 눌렀는가) css가 안될때 .class 를 제대로 입력했는가 ;세미콜론을 제대로 입력했는가 {}를 양쪽 모두 잘 입력했는가 div가 보이지 않을때 height을 입력해주었는가_div는 block요소이므로 width는 100%로 맞추어져 있으나 height는 지정되어 있지 않다. img가 보이지 않을때 파일의 대소문자를 틀린경우 파일의 경로(위치)가 잘못된 경우 코드를 저장하지 않은 경우 2022. 4. 18.
1. html5페이지의 구조, 태그의 종류 최상위 태그는 html태그이다. 0. html 태그 -lang 속성 1. head태그 head태그에는 사이트의 정보를 명시해준다. 1) 웹 페이지의 제목을 지정한다. 아래의 그림처럼 가시적으로 보여준다. 유저에게 문서의 제목을 알리는 용도 뿐만 아니라, 검색 엔진 등에서 가장 크게 보여지는 텍스트이므로 페이지의 특성을 드러내는 제목을 작성하는 것이 중요하다. https://dasima.xyz/html-title-%ED%83%9C%EA%B7%B8/ 2) 웹페이지에 문서의 내용, 키워드, 만든이 등 문서 자체 특성과 관련된 추가정보를 저장한다. meta태그는 미디어 쿼리와도 관련이 있다. 더보기 미디어쿼리 https://skydoor2019.tistory.com/m/8 미디어 쿼리 포함 이번 예제에서는 앞선.. 2022. 4. 18.
1. 웹 페이지 기본 구조와 작성 방법 w3c markup validation service https://validator.w3.org/ 학습목표 -태그, 요소, 속성의 의미를 이해합니다. -HTML 태그, CSS, 자바스크립트를 사용해 웹 페이지를 작성하는 방법을 익힙니다. -검사로 디버그하는 방법을 알아봅니다. 1. html5 기본 용어_ 태그, 요소, 속성 요소(element)는 좁게는 브라우저 상에서 보이는 제목, 본문, 이미지를 이야기 하고 넓게는 브라우저상에서의 모습은 물론, html문서상에서 작성되는 제목, 본문, 이미지, 시작태그(start tag)와 끝태그(end tag), 그리고 사이에 들어가는 내용 등 html 페이지를 구성하는 모든 것을 말합니다. 자바스크립트에서는 객체(object)라고도 합니다. 태그(tag)는 이러.. 2022. 4. 16.
0. 웹 동작과 웹 표준 기술, html5 참고자료 : html5 웹 프로그래밍 입문 = html5 web programming(2019), 윤인성 지음 저, 한빛아카데미 ppt 1. 백엔드와 프론트엔드의 구성 백엔드 서버 프로그램이란 : 클라이언트 요청에 따라 적절한 파일과 데이터를 제공하는 프로그램 서버 프로그램을 다루기 위해 백엔드 개발자가 사용하는 언어와 툴 : 자바, c#, 루비, 파이썬, 자바스크립트 웹 프레임워크(ASP, NET, JSP, PHP 등) MVC 프레임워크(ASP.NET MVC, Spring MVC, Ruby on Rails) 비동기 프레임워크(Node.js Express, Jetty) 프론트엔드 클라이언트 프로그램이란 : 웹 브라우저에서 작동하는 프로그램 //넓은 의미에서는 웹에 연결하려는 사용자라고 할 수 있지만 대체.. 2022. 4. 16.