FE/Web

Web 기초 지식

serin99 2023. 6. 30. 21:32
728x90

이번 포스팅에서는

HTML, CSS, JavaScript 등등 

Web을 구성하는 요소에 대해 정리해보았습니다.

 

기본적으로 웹 페이지는 HTML로 구현된다.

 

HTML은 "Hyper Text Markup Language"의 약자로 웹 사이트의 페이지의 제목, 문단 등의

웹의 모습을 기술하기 위한 마크업 언어이다.

 

 

Web의 구조등 정적인 컨텐츠 밖에 표현할 수가 없다.

 

마우스 포인터가 하이퍼링크 위로 이동하면 하이퍼링크 텍스트 색상이 바뀌거나,

서브메뉴가 열리는 등의 효과는 HTML 과 함께 사용되는

PHP나 JavaScript 같은 스크립트를 함께 사용해야 가능하다.

 

 

 

CSS는 (Cascading Style Sheets)는 마크업 언어 등의  보조적인 역할을 수행한다.

실제 화면에 표기되는 색상, 크기, 폰트 등을 지정해 콘텐츠를 꾸며주는 시각적인 표현을 담당한다. 

 

 

HTML 작성시 위 사진과 같은 코드로 CSS 파일을 불러올 수 있다.

 

불러온 CSS 파일은 

HTML의 영역에 대한 색상, 크기 등을 지정해주는 것을 볼 수 있다.

 

JavaScript는  HTML과 CSS를 동원하여  콘텐츠를 바꾸고 움직이는 등 페이지를 동적으로 꾸며주는 역할을 하는 프로그래밍 언어로 웹의 동적 처리를 담당한다.

 

 

위 사진과 같은 코드를 입력하여 images 폴더 안에 있는 led 사진을 on, off 버튼을 통해

on 버튼을 누르면 켜진 led의 사진을 불러오고 off 버튼을 누르면 꺼진 led의 사진을 images 폴더에서

가져와 web에서 보여주는 동작을 한다.

728x90