본문 바로가기

웹디자인 (HTML,JS)44

CSS로 특정 브라우저를 선택하는 방법 반응형 웹을 만들다보면 다양한 OS와 브라우저에 따라 표시되는 모습이 달라질 수 있어서 특정 OS나 브라우저를 CSS로 선택할 수 있는 방법을 정리합니다. 다양한 OS와 브라우저에 적합하게 일반적인 CSS 속성만으로는 다소 어려움이 있다. 선택자와 가상선택자 CSS로 특정 요소를 선택하는 방법 CSS 기본 문법은 선택자 { 속성1: 값1; 속성2: 값2; ... } 입니다. HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. blog.pages.kr CSS로 특정 요소를 선택하는 방법 가상선택자는 기본선택자 뒤에 :(콜론)을 붙인 가상 클래스, ::(콜론두개)을 붙인 가상 요소로 요소의 특정 부분을 선택합니다. blog.pages.kr 브라우저 선택자 (CS.. 2021. 1. 21.
구글 무료 한글폰트 간단 사용방법 홈페이지나 블로그를 만들 때 한글 폰트를 무료로 아주 간단하게 적용할 수 있다. 상업적인 사이트에서도 폰트를 무료로 이용이 가능하다. 1. Browse Fonts - Google Fonts 홈페이지 접속 https://fonts.google.com/ 2. Korean(한글) 선택 3. 한글폰트 26개 중 원하는 폰트 선택 4. 원하는 사이즈 (보통 400) 우측 "+ Select this style" 클릭 5. 우측 "Selected family" Review 박스 하단 태그를 복사해서 홈페이지 태그 안에 붙여넣기 6. 폰트를 적용하고자 하는 CSS에 위 font-family 복사해서 붙여넣기 7. 텍스트를 작성할 때 직접 HTML 태그 style로 적용해도 가능함 구글 노토산스 한글폰트 폰트를 하나씩 .. 2021. 1. 13.
홈페이지 레이아웃 구조를 구성하고 배치하기 홈페이지나 블로그를 원하는 레이아웃 구조로 구성하고 적절하게 배치하는데 사용되는 CSS 속성을 정리합니다. 다양한 형태의 레이아웃이 있는데 아래 CSS 속성을 이용하여 모든 구조의 박스 구성이 가능하다. 선택자와 가상선택자 CSS로 특정 요소를 선택하는 방법 CSS 기본 문법은 선택자 { 속성1: 값1; 속성2: 값2; ... } 입니다. HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. blog.pages.kr CSS로 특정 요소를 선택하는 방법 가상선택자는 기본선택자 뒤에 :(콜론)을 붙인 가상 클래스, ::(콜론두개)을 붙인 가상 요소로 요소의 특정 부분을 선택합니다. blog.pages.kr 박스 요소 표시 display - 요소를 표시하는 방법을 .. 2021. 1. 10.
CSS로 특정 요소를 선택하는 방법 <가상선택자> CSS로 특정 요소를 선택하는 방법 CSS 기본 문법은 선택자 { 속성1: 값1; 속성2: 값2; ... } 입니다. HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. blog.pages.kr HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. 가상선택자는 기본선택자 뒤에 :(콜론)을 붙인 가상 클래스, ::(콜론두개)을 붙인 가상 요소로 요소의 특정 부분을 선택합니다. 구조 선택자 :empty로 내용이 비어있는 HTML 요소들을 선택한다. p:empty { color: red; } 태그 요소 중 내용(공백포함)이 전혀 없는 요소의 스타일을 빨간색으로 적용한다. :first-child로 첫번째 형제 요소(단일).. 2021. 1. 10.
CSS로 특정 요소를 선택하는 방법 <선택자> CSS 기본 문법은 선택자 { 속성1: 값1; 속성2: 값2; ... } 입니다. HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. 참고로, jQuery에서는 $('요소')와 같은 방식으로 특정 HTML 태그를 선택할 수 있다. 자바스크립트에서는 getElementById('요소')의 방식으로 많이 사용된다. 함수의미는 get(가져오다) Element(요소) By(부터) Id(Identity:식별값) 정도로 해석할 수 있다. CSS에서 선택자를 활용하기 위해 부모·자식, 형제 관계를 알아야 한다. 부모 형 제 부모·자식은 어떤 태그 안에 다른 태그가 있는 관계로 는 부모이고 와 는 자식이다. 형제는 같은 부모를 둔 태그로 바로 다음에 오는 형제는 이다. 전.. 2021. 1. 9.