본문 바로가기

반응형

Web Programming

[학습 2] HTML 텍스트 요소 다루기 HTML 텍스트 요소 다루기안녕하세요! HTML/CSS 학습 시리즈의 두 번째 글입니다.지난 시간에는 HTML의 기본 개념과 구조에 대해 알아보았는데요, 오늘은 웹 페이지에서 텍스트를 표현하는 다양한 HTML 요소들을 배워보겠습니다.제목 태그 ( ~ )HTML에서는 6단계의 제목 태그를 제공합니다. 이 가장 중요하고 큰 제목이며, 으로 갈수록 중요도와 크기가 작아집니다.가장 중요한 제목 (h1)두 번째 수준 제목 (h2)세 번째 수준 제목 (h3)네 번째 수준 제목 (h4)다섯 번째 수준 제목 (h5)여섯 번째 수준 제목 (h6)제목 태그는 단순히 텍스트 크기를 조절하는 용도가 아니라 문서의 구조와 의미를 정의하는 중요한 역할을 합니다. 검색 엔진은 이 제목 태그를 통해 페이지의 주요 내용을 파악하므로 .. 더보기
[학습 1] HTML 소개와 기본 구조 HTML 소개와 기본 구조안녕하세요! 오늘부터 새롭게 시작하는 HTML/CSS 학습 시리즈의 첫 번째 글입니다.먼저 HTML 기초 1단계로 체계적이며 단계별 학습을 하기 위한 첫걸음으로, HTML의 기본 개념과 구조를 알아보겠습니다.HTML이란 무엇인가?HTML(HyperText Markup Language)은 웹 페이지를 만들기 위한 표준 마크업 언어입니다. 웹 브라우저는 이 HTML 코드를 읽고 사용자에게 시각적인 웹 페이지로 표현해 줍니다.주요 특징:마크업 언어: 프로그래밍 언어가 아닌 문서의 구조를 정의하는 언어태그 기반: 꺾쇠 괄호()로 둘러싸인 요소들로 구성계층적 구조: 요소들이 서로 중첩되어 부모-자식 관계를 형성  웹 페이지의 기본 구조모든 HTML 문서는 다음과 같은 기본 구조를 가집니다.. 더보기
HTML 문서에 <img> 태그로 이미지 띄우기 HTML을 작성하다가 이미지를 띄우는 경우가 많습니다. 이럴 때 사용하는 태그가 태그입니다. 이번에는 태그 사용방법에 대해 알아보고 예제를 통해 확인해 보겠습니다. HTML 제목 및 문단 태그와 특수문자 입력에 대해 알아보기 HTML 제목 및 문단 태그와 특수문자 입력에 대해 알아보기 일반적으로 태그는 여는 태그와 닫는 태그가 함께 쓰입니다. 그리고, 태그를 사용하여 텍스트, 이미지, 멀티미디어 콘텐츠를 HTML 문서로 나타내는 것을 마크업(Markup)한다고 합니다. 이 이유로 하 mr-johndoe.tistory.com 1. 태그 태그는 자신의 컴퓨터 하드에 저장되어 있는 이미지 파일을 HTML 문서에 띄울 때 사용하며 닫힘 태그가 없습니다. 사용 방법은 다음과 같습니다. 파일명에는 이미지로 올리고자.. 더보기
HTML 제목 및 문단 태그와 특수문자 입력에 대해 알아보기 일반적으로 태그는 여는 태그와 닫는 태그가 함께 쓰입니다. 그리고, 태그를 사용하여 텍스트, 이미지, 멀티미디어 콘텐츠를 HTML 문서로 나타내는 것을 마크업(Markup)한다고 합니다. 이 이유로 하이퍼텍스트(Hypertext)를 마크업하는 언어라는 의미의 HTML(Hyper Text Markup Language)이란 이름이 지어졌습니다. 이번에는 HTML에서 쓰이는 태그에 대해 알아보고 주석 및 특수문자 입력하는 방법에 대해 알아보겠습니다. 1. HTML 기본 구조 다음은 HTML의 기본 형식입니다. 는 HTML5 문서 규격인 HTML 문서임을 표시하는 태그입니다. 과 은 HTML 문서에는 반드시 들어가는 태그로 이 태그 안에 모든 내용이 들어가야 합니다. 그리고, 와 는 태그안에 기본적으로 들어가는.. 더보기
자바스크립트의 함수에 대해 알아보기 II 함수의 사용 방법과 콜백 함수(Callback Function)에 대해 이전 글에서 알아봤습니다. 이번에는 콜백 함수를 인자로 사용하는 함수에 대해 알아보고자 합니다. 자바스크립트의 함수에 대해 알아보기 I 자바스크립트의 함수에 대해 알아보기 I 함수는 여러 코드들을 하나로 묶어 관리함으로 쉽고 편하게 프로그래밍할 수 있도록 해줍니다. 함수를 사용하게 되면 프로그램이 간략하게 되며 반복적인 작업이 줄어들게 되어 프로그램 작성 mr-johndoe.tistory.com 3. forEach 함수 forEach 함수는 배열에서만 사용되는 메서드로 배열의 요소들을 반복 사용하는 반복문입니다. 콜백 함수를 사용하여 forEach를 사용할 때 사용 방법은 아래와 같습니다. 배열 이름. forEach ( functio.. 더보기
자바스크립트의 함수에 대해 알아보기 I 함수는 여러 코드들을 하나로 묶어 관리함으로 쉽고 편하게 프로그래밍할 수 있도록 해줍니다. 함수를 사용하게 되면 프로그램이 간략하게 되며 반복적인 작업이 줄어들게 되어 프로그램 작성을 편리하게 해줍니다. 함수에 대해 자세히 알아보고 이를 적극 활용하여 보다 즐거운 프로그래밍이 되도록 합시다. Visual Studio Code 설치 Visual Studio Code 설치 HTML, CSS, Javascript를 작성할때 사용하는 프로그램중 최근에 가장 많이 사용되고 있는 개발 전용 에디터 프로그램인 비주얼 스튜디오 코드 (Visual Studio Code)에 대해서 알아보겠습니다. Visual Studio Code mr-johndoe.tistory.com Visual Studio Code 자바스크립트 실행.. 더보기
자바스크립트 반복문 For와 While 사용하기 1. For 문 For문은 주어진 조건이 참이면 For문을 수행하고 주어진 조건이 거짓이면 For문 다음 문장을 수행합니다. 가장 일반적으로 반복문을 사용할 때 For문을 사용합니다. 또한 자바스크립트에서는 For문 외에도 For in, For of 등이 있습니다. ① For 문 For 문의 구성은 다음과 같습니다. for ( 초기값 ; 조건문 ; 초기값의 변화량) { 실행문 } For문은 주어진 초기값이 조건문에 부합하는지 확인하고 참이면 실행문을 실행합니다. 그리고 초기값을 초기값의 변화량만큼 변화시킵니다. 다시 변화된 초기값을 조건문에 부합하는지 확인하고 거짓이 될 때까지 실행문과 초기값의 변화량을 실행하며 For문을 반복 수행합니다. 1부터 10까지 화면에 출력하는 반복문을 For문으로 만든다면 .. 더보기
자바스크립트 배열 선언하는 방법 배열은 숫자, 문자, Bool과 같은 데이터를 하나의 묶음으로 만든 것입니다. 기존 상수나 변수는 하나의 값만을 갖습니다. 하지만 배열은 여러가지의 값을 가질 수 있습니다. 배열에 입력되는 값을 요소라고 합니다. 배열은 정의된 이름으로 요소의 개수만큼 방을 만든다고 생각하시면 됩니다. 그리고 가장 첫번째 방이 0번이라는 것도 기억해 두시기 바랍니다. 배열을 선언하는 방법은 아래와 같습니다. 배열이름 = [ 요소1, 요소2, 요소3, ..., 요소n ] 위의 식을 풀어쓰자면 배열이름의 배열을 만드는데 요소의 개수인 n개의 방을 만들어 각 요소1부터 요소n까지 입력합니다. 가장 첫번째 방은 0번방으로 요소1이 입력됩니다. 이를 풀어 쓴다면 다음과 같습니다. 배열이름[0] = 요소1 배열이름[1] = 요소2 .. 더보기

반응형
<--! 네이버 애널리틱스 시작작--> <--! 네이버 애널리틱스 끝끝-->