앱 만들기389

• 

  10-1강. 하이퍼링크 두개 페이지 이동하기 하이퍼링크를 사용해서 두 개의 페이지를 서로 이동해 본다.첫 번째 웹페이지에 하이퍼링크를 만든다. To B page  a 태그의 href 속성값으로 두 번째 웹페이지의 주소를 적는다.웹페이지의 저장위치가 같은 곳일 경우 파일명만 적어도 된다. To A page  두 번째 페이지에서도 a 요소를 작성하고,필수 속성값으로 첫 번째 페이지의 파일명을 기재한다.  브라우저에서 확인해보면, 정상적으로 두 페이지가 서로 왕래 가능해진다.간단하지만 두 개의 페이지가 서로 링크 가능한 웹 사이트가 만들어진 것이다.웹 사이트는 이렇게 만들어진다. 앱 만들기/HTML5 study 2024. 7. 4.

• 

  10강. 하이퍼링크 만들기 9강. CSS 클래스 선택자 사용방법8-2강. CSS 테두리 와 마진, 패딩 속성 사용방법테두리 설정 방법을 먼저 알아보자div 요소는 이미 크기와 배경색상을 설정한 상태이다.1.  테두리 설정하기테두리 설정을 위한 CSS 속성은 border 이soo0100.tistory.com 웹 사이트는 많은 웹 페이지들로 연결되어 있다.특정 이미지나 텍스트를 클릭하면 새로운 페이지가 열리는 동작을 하이퍼링크 라고 말한다.HTML a태그 가 바로 이 하이퍼링크 기능르 수행한다.  열림 태그와   닫힘 태그로 구성되어 있고,href : 이동할 웹페이지 URL(주소) 필수 속성을 가진다. 구글페이지로 이동  예제에서는 href 속성값으로 구글 홈페이지를 적어준다.a 태그의 콘텐츠 영역에는 하이퍼링크 텍스트 로 보여질.. 앱 만들기/HTML5 study 2024. 7. 3.

• 

  9-1. CSS 태그 선택자 사용법 CSS 태그선택자란 HTML 태그 이름을 선택자로 사용한다.예를 들어, p 태그에 적용할 스타일을 정의하고 싶을때는. p{  스타일} 이렇게 정의한다. p 태그에는 별도의 속성을 주지 않더라도 p요소에 정의한 스타일이 적용된다. * 선택자 란?태그 선택자는 일반적으로 head 요소 사이에 정의한다.  head 요소 사이에는 대게 브라우저에게 정보를 알려주는 코드 를 넣는다.CSS 를 적용할 것임을 브라우저에게 알려주기 위해서닫힘 태그를 사용한다. Lorem Ipsum is simply dummy text of the printing and typesetting industry. It is a long established fact that a reader will be distrac.. 앱 만들기/CSS study 2024. 7. 2.

• 

  9강. CSS 클래스 선택자 사용방법 8-2강. CSS 테두리 와 마진, 패딩 속성 사용방법테두리 설정 방법을 먼저 알아보자div 요소는 이미 크기와 배경색상을 설정한 상태이다.1.  테두리 설정하기테두리 설정을 위한 CSS 속성은 border 이다. 속성값으로는 기본적으로 3가지 값을 설정soo0100.tistory.com  HTML 태그에 일일이 CSS 클래스 속성을 주고 스타일을 입히는 것은 반복되는 작업이 될 수 있다.예를 들어 여러 div 요소에 동일한 디자인 스타일을 입히고 싶은데, 똑같은 작업을 반복하니 말이다이럴 때 CSS 클래스 선택자 를 사용하면 쉽게 스타일을 적용할 수 있다. * 선택자(selector) 란? CSS 클래스 선택자 정의 방법은 . ClassName {스타일 } .(점) 다음에 클래스 이름을 적어주고 { }.. 앱 만들기/CSS study 2024. 7. 1.

• 

  8-2강. CSS 테두리 와 마진, 패딩 속성 사용방법 테두리 설정 방법을 먼저 알아보자div 요소는 이미 크기와 배경색상을 설정한 상태이다.1.  테두리 설정하기테두리 설정을 위한 CSS 속성은 border 이다. 속성값으로는 기본적으로 3가지 값을 설정할 수 있다. border : 테두리 설정 속성4px solid green : 테두리 굵기 , 테두리 선 스타일 , 테두리 선 색 굵기를 4px로 , 선 스타일은 솔리드 타입으로 줄. 줄의 색상은 녹색으로 설정했다. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.  브라우저에서 확인해보면,위와 같이 테두리가 잘 .. 앱 만들기/CSS study 2024. 6. 30.

• 

  8-1강. CSS 크기 속성 8강. CSS 속성 여러개 적용하는 방법HTML태그에 CSS를 여러개 적용해보자.방법은 각 스타일 사이에 ; (세미콜론) 으로 속성과 값을 구분해서 코딩하면 된다. Lorem Ipsum is simply dummy text of the printing and typesetting industry.  위 예제에서는backsoo0100.tistory.com CSS 의 여러속성 중 눈에 가장 손쉽게 띄는 속성은 바로 크기 조정이다.해당 속성을 div 태그에 정해두면 div 영역의 크기를 마음대로 조정할수 있다. It is a long established fact that a reader will be distracted by the readable content of a page when.. 앱 만들기/CSS study 2024. 6. 29.

• 

  8강. CSS 속성 여러개 적용하는 방법 HTML태그에 CSS를 여러개 적용해보자.방법은 각 스타일 사이에 ; (세미콜론) 으로 속성과 값을 구분해서 코딩하면 된다. Lorem Ipsum is simply dummy text of the printing and typesetting industry.  위 예제에서는background-color : pink (배경색)color : white (글자색)text-align : center (글자정렬) 세가지 속성은 ; 세미콜론으로 구분되며, 속성들이 적용된 p 요소는 브라우저에 하기처럼 예쁘게 표현된다.무미건조했던 HTML 웹문서에 드디어 스타일을 적용한 것 이다.   8-1강. CSS 크기 속성CSS 의 여러속성 중 눈에 가장 손쉽게 띄는 속성은 바로 크기 조정이다.해당 속성을 div.. 앱 만들기/CSS study 2024. 6. 28.

• 

  7강. CSS 적용하기 6강. div 태그 사용방법5강 img 태그 사용법4강. br 태그 사용법3강. P 태그 사용법2강. HTML 태그란 무엇일까?HTML에서 태그란 무엇일까?바로 기호로 둘러쌓인 HTML 문법의 가장 작은 단위 이다.  시작되는 태그 를 start tag(시soo0100.tistory.com CSS 는 HTML 요소에 디자인을 입히는 역할을 한다.CSS 는 Cascading Style Sheets 또는 스타일스 라고도 불리운다. CSS를 HTML에 적용하는 방법 중 하나는 HTML 태그의 style 속성을 추가 후 하기 포맷으로 설정한다. style = "CSS 속성 : 속성값" 속성은 적용하려는 디자인 모양과 형태를  뜻한다.속성값은 적용하는 값이 되겠다.(수치,색상...) Lorem Ipsum.. 앱 만들기/CSS study 2024. 6. 27.

• 

  6강. div 태그 사용방법 5강 img 태그 사용법4강. br 태그 사용법3강. P 태그 사용법2강. HTML 태그란 무엇일까?HTML에서 태그란 무엇일까?바로 기호로 둘러쌓인 HTML 문법의 가장 작은 단위 이다.  시작되는 태그 를 start tag(시작 태그) 닫히는 태soo0100.tistory.com div 태그는 웹 페이지의 내용들의 구역을 나누는 역할을 한다.그렇기에 div 태그 자체의 시각적인 기능은 없다.div 태그는 열림태그 닫힘태그로 구성되어있다. HTML을 처음 접하고 HTML태그만 사용할때는 div 태그를 굳이 왜 써야 하는지 모를 수 있다. 당연히 시각적으로 나타나는 것이 없으니.CSS와 접목이 되면 특정 구역에만 CSS를 활용한 스타일을 적용할거나 JS(자바스크립트) 로 특정 구역을 컨트롤 할때도유용.. 앱 만들기/HTML5 study 2024. 6. 26.

• 

  5강 img 태그 사용법 4강. br 태그 사용법3강. P 태그 사용법2강. HTML 태그란 무엇일까?HTML에서 태그란 무엇일까?바로 기호로 둘러쌓인 HTML 문법의 가장 작은 단위 이다.  시작되는 태그 를 start tag(시작 태그) 닫히는 태그를 end tag  (닫힘soo0100.tistory.com  img 태그는 웹페이지에 이미지를 나오게 한다.이미지는 로컬(컴퓨터)에 저장된 이미지 뿐 아니라 인터넷에 저장된 이미지도 호출 할 수 있다.img 태그의 주요 속성으로는  src , alt 가 있다(* 속성 : 속성이란 웹 페이지에 넣을 요소(element)에 관한 정보들을 브라우저에게 알려주는 방법이다                        img 태그의 주요 속성이라 하면 이미지 위치와 이미지에 대한 설명이다.)s.. 앱 만들기/HTML5 study 2024. 6. 23.