본문 바로가기

분류 전체보기60

css 그리드 그리드는 display속성의 값이다. display 속성의 값으로는 block, inline 등 다양한 것이 올 수 있는데 그 중 그리드는 두가지 태그의 비율을 정하여 칸을 나눠준다. 그렇게 하기 위해선 div태그 상위의 div태그가 더 필요하다.
css 블록 html문서의 태그들은 각자의 크기를 갖는다. 예를들어 h1태그는 줄바꿈이되고 a태그는 줄바꿈이 안되듯이 각자의 크기를 갖고 있다. 위와 같이 border 속성을 주어 해당 크기를 확인해 볼 수 있다. 해당 크기는 diplay 속성을 통해 변경할 수 있다. 선택자는 ,를 통해 여러가지 선택자를 한번에 불러올 수 있다. 위의 코드는 아래와 같이 더 생략하여 작성할 수 있다. ● 박스모델 박스 모델에서는 여러가지 개념이 있다. 먼저 아래의 코드와 결과는 기본 코드와 결과이다. ● padding padding 개념은 content와 테두리 사이의 간격이다. ● margin margin은 테두리와 테두리 사이의 간격이다. ● display block, width, height block level의 특성은 화면..
css 선택자 ● 선택자 우선순위 html문서 내부에서의 css 선택자는 우선순위를 갖는다 여기서 모든 링크를 검은색 색상으로 변경으로 변경하고, 현재 선택된 페이지는 붉은색으로 표시하고 읽었던 페이지는 회색으로 표시하려 한다. 색상이 변경된 것을 볼 수 있다. ● 방법 1 (인라인 속성 이용) 방법 1은 코드의 중복이 발생하기 때문에 좋지 못한 방법이다. html태그의 속성중에는 class 속성이 있는데 위 방법을 사용하면 더 중복을 없앨 수 있다. ● 방법 2 (class 속성 이용) html 속성중 class를 사용하여 전체 색상을 변경할 수 있다. 스타일태그 내부에서 클래스 값이 saw인 경우를 불러오고 싶다면 . 을 꼭 앞에 작성해줘야 한다. 여기서 실제 머무르는 페이지는 빨간색으로 추가적으로 표시해주고 싶다..
css 기본 ● css Basic css는 html로 작성된 문서의 디자인 요소를 정하는 언어이다. : 스타일 태그는 html 문법인 동시에 해당 태그 내에 있는 것은 css이기 때문에 css의 언어 문법에 맞게 해석한다. style 태그는 head 태그 내부에 작성한다. a { ← Selector color:red; ← Declaration } ↑Property:Value; 모든 a 태그의 content color을 빨간색으로 바꾼다. html에서 색상을 변경할때는 하고싶은 부분 모두 태그를 사용하여 하나하나 사용해야하지만, css언어를 활용한다면 많은양을 일괄적으로 처리할 수 있어 효율적이다. 스타일 태그를 사용하지 않고도 html 문서에 속성 값을 통하여 css언어를 사용할 수 있다. CSS 위처럼 태그 내부에..
인터넷 작동 원리 Web Browser → Web Server 요청 Web Server → Web Browser 응답 Web Browser 는 클라이언트, Web Server는 서버로 불린다. Web Server를 운영하는 방식은 2가지가 있다. web hosting : 웹 서버를 운영하는 회사에 맡긴다. web server : 웹 서버를 직접 운영한다. 컴퓨터가 있어야 하며 컴퓨터가 항상 켜져있으며 인터넷이 연결되야 한다. 호스팅과 직접 운영은 장단점이 있다. 호스팅은 호스팅만을 전문적으로 하는 업체 혹은 집단에서 관리해주기 때문에 코딩만하면 된다는 장점이 있다. 호스팅를 맡기게 된다면 웹서버의 동작 원리나 웹 서버를 통해 직접 서비스를 할 수 없다는 단점이 있다.
html 기본 html은 웹 사이트을 구성하는 마크업 언어이다. html의 태그는 html문서를 구성하는 단위이다. : 태그 내부 요소를 진하게 : 태그 내부 요소를 밑줄 : ~ 까지 총 6개가 있으며 글씨가 진하게 표시되며 줄바꿈이 된다. 제목을 나타내는 태그이다. : 줄바꿈을 해주는 태그이다. 이 태그는 시각적 의미만 갖고 있기 때문에 닫지 않는다. : 단락을 나눠주는 태그이다. : 이미지를 웹에 띄워주는 태그이다. 태그내부에 width와 height등 속성을 통해 크기를 지정할 수 있다. : li태그는 리스트를 순차적으로 나타내주는 태그이다. : ul태그는 리스트의 부모 태그이며, li태그를 여러번 사용할때 분류해주기 위한 태그이다. : ol태그는 ul태그와 유사하지만 리스트의 요소들을 1. 2. 등 증가되는 숫..

티스토리툴바