어찌저찌 코딩생활7 [CSS] 여러가지 속성, 속성값 / 폰트 설정, 배경 설정 1. 여러가지 속성, 속성값 1) 폰트 설정 - font-size: 크기 단위 -> 폰트의 크기 주로 px 단위를 사용하며, 각 선택자의 글자 크기를 설정할 수 있다. - color: 색상코드 or RGB 코드 등 -> 글자 색깔 설정 h1태그와 h2 태그에 글자 색깔이 다르게 적용되었다. - font-weight : 100~900사이 100단위의 숫자 -> 글자 굵기 h1 태그에 글자 굵기를 다르게 적용하였으며 "belong"이라는 id를 가진 '한양대학교 화학공학과 3학년' 글자에 링크가 걸려있음을 표현하기위해 굵기를 더 굵게 설정하였다. (HTML 파일에 링크가 걸려있음) - text-decoration: none(아무것도 없음) / underline(밑줄) / line-through(취소선) 원래.. 2023. 12. 4. [CSS] 폰트 적용하기, 색상을 나타내는 법 1. 구글 폰트 적용하기 웹사이트의 폰트를 우리가 따로 설정해줄 수 있다. 이때, 굳이 폰트를 다운받거나하지 않아도 구글 폰트를 이용하면 기존에 존재하는 여러 폰트를 간편하게 사용할 수 있다. 구글 폰트 적용을 위해서는 1) 구글 폰트 사이트에 들어간다. https://g.co/kgs/aZvbgA 2) 원하는 폰트를 선택해준다. 나는 나눔 고딕을 선택했다. 3) 원하는 굵기의 폰트를 선택해 오른쪽의 +버튼을 눌러준다. (selct ~~~ +) 그렇게되면 오른쪽 사진과 같이 장바구니에 선택한 폰트들이 담겨있는 것을 볼 수 있다. 4) 링크를 복사해 HTML파일에 붙여넣기한다. 다음과 같이 head 태그 내에 그대로 복사 붙여넣기해주면 된다. 5) CSS rules to specify families 를 클.. 2023. 12. 4. [CSS] CSS 규칙, 선택자, 아이디(id), 클래스(class) 1. CSS 파일 만들기 VS Code에서 파일을 추가한 다음 '파일명.CSS'라고 입력해주면 CSS 파일을 만들 수 있다. 이후 html 파일 태그 내에 를 입력해주면 앞서 만든 CSS 파일과 기존 html파일을 연결할 수 있다. 이때, rel="stylesheet"는 CSS파일과 HTML 파일 사이의 관계(relationship)이 stylesheet(CSS가 HTML 파일의 스타일을 나타낸다.)라는 것을 의미한다. 2. 태그 선택자 우리는 원하는 스타일을 웹사이트의 원하는 부분에 적용시켜야한다. 즉, 알맞은 CSS 언어를 원하는 HTML 파일 부분과 연결시켜주어야한다. 이때, 우리가 HTML에서 사용했던 '태그'를 이용한다. 내가 만든 HTML 코드를 실행시켜보면 다음과 같은 웹사이트 화면이 나온다.. 2023. 12. 4. [HTML] 특수문자 표기, 블록 레벨요소, 인라인 레벨요소 태그는 소문자로 - 대문자로 쓴다고 오류가 발생하지는 않지만 가독성을 위해 관례적으로 소문자를 사용한다. - 주석 다는 법(컴퓨터가 실행하지 않는 부분) : / 파이썬에서 #과 같은 기능이다. 특수문자 표기하기 - HTML에서 &, < 와 같은 특수 기호들은 그대로 사용하면 안되고 "엔터티 코드"를 사용해야한다. - 예시: 마우스&키보드 가 아니라 마우스 & 키보드 로 작성해야한다. 이 때, &를 &의 엔터티 코드라고 칭한다. - 엔터티 코드는 인터넷에 검색해서 알아낼 수 있음. https://entitycode.com/ 참고 Entity Code - A Clear and Quick Reference to HTML Entities Codes About EntityCode The idea cam.. 2023. 11. 15. 이전 1 2 다음