웹

HTML 응용(1) - element들 간의 관계, 이미지 삽입하기

이번 포스팅에서는 앞서 배웠던 html 엘리먼트들을 활용하는 법에 대해 다루도록 하겠다. 엘리먼트들 간의 관계 이미지 삽입하기 엘리먼트들 사이의 관계에 대해 얘기하기 전에 우선 다음과 같은 코드로 html과 css를 작성하였다고 하자. 안녕하세요 환영합니다. /* CSS style sheet */ *{ margin:0; } #wrap{ background: red; height:500px; width:500px; } #header{ background: yellow; height:250px; width:250px; } 해당 코드를 실행한 결과는 아래와 같은 모습을 띠고있다. 앞서 배웠던 것처럼 엘리먼트 안에 두개의 를 작성 할 경우 페이지에 두개의 영역이 블럭 속성으로 자리잡게 된다. 그렇다면 두개의 를..

CSS란?

css란? css의 역할 css와 html의 관계 CSS(Cascading Style Sheets)는 마크업 언어가 실제 표시되는 방법을 기술하는 스타일 언어(style sheet language)로 HTML에서 주로 쓰인다. CSS는 HTML과 같은 하나의 언어다. 그리고 이 언어의 목표는 디자인하는 것에 최적화 되어있다고 볼 수 있다. css는 기본적으로 html을 꾸며주는 역할을 한다고 보면된다. 기존에 가지고 있던 엘리먼트의 속성을 변경시켜주는 역할을 하는 것이 css이다. 예를 들면 display가 블럭인 것을 인라인으로, 인라인인 것을 블럭으로 변경하는 등 요소를 내 마음대로 조절할 수 있다. 더 나아가서 글자크기, 색상 등도 조절할 수 있다. ex) 엘리먼트의 속성은 블럭형태, css를 활용..

HTML의 기초(3) - table 생성하기

HTML에서 table 생성하기 HTML에서의 핵심 내용 요약 html에서 엘리먼트를 사용하여 테이블을 만들고 이를 활용해서 게시판, 회원가입 페이지 등과 같은 것들을 만들 수 있다. html을 이용하여 웹페이지 상에 테이블을 생성하기 위해서는 우선 다음과 같은 프로세스를 따라야 한다. row를 생성한다. column을 생성한다. 엘리먼트는 기본적으로 엘리먼트 안에서 작성한다. 그리고 row를 생성하기 위해서는 엘리먼트, column을 생성하기 위해서는 엘리먼트를 사용한다. 아래의 코드를 보고 좀 더 이해해 보자. 1 2 3 4 5 6 7 8 9 10 11 12 번호 제목 작성자 작성일 조회수 1 안녕하세요 ingoo 2021-12-21 10 2 안녕하세요 ingoo 2021-12-21 11 엘리먼트 안..

HTML 코드 (1)~(2)

Hello, World!! ingoo 제목1 제목2 제목3 제목4 제목5 제목6 리스트1 리스트2 리스트3 리스트4 링크 구글로이동 영역 작은영역 작은영역2 영역2 로그인 남자 여자 사람아님 컴퓨터 영화 독서 운동 잠