CSS
-
CSS 기초 - 외부CSS, 내부CSS, 인라인CSS, 계단식 순서프로그래밍언어/CSS 2023. 4. 2. 16:38
CSS를 삽입하는 세 가지 방법 1. 외부 CSS 2. 내부 CSS 3. 인라인 CSS 외부 CSS 외부 스타일 시트를 사용하면 파일 하나만 변경하여 전체 웹 사이트의 모양을 변경할 수 있다 head 섹션 안에, link 요소 안에 외부 스타일 시트 파일에 대한 참조를 포함해야 한다 외부 스타일 시트는 모든 텍스트 편집기에서 작성할 수 있으며 .css 확장자로 저장해야 한다 외부 .css 파일에는 HTML 태그가 포함되어서는 안 된다!!! 위 사진은 "mystyle.css" 파일의 모양이다 ※ 속성값과 단위 사이 공백 금지 ( 20 px 로 하지 말고 공백 제거해서 20px 로 해야 함 ) ※ 내부 CSS 단일 HTML 페이지에 고유한 스타일이 있는 경우 내부 스타일 시트를 사용할 수 있다 내부 스타일은..
-
CSS 기초 - 선택기, 클래스 선택자, 범용 선택기, 그룹화 선택기프로그래밍언어/CSS 2023. 4. 2. 15:58
CSS 선택기 CSS 선택기는 스타일을 지정할 HTML 요소를 찾는(선택하는) 데 사용된다 위의 코드에서 head 태그 안에 style 태그를 만들어 주었고 body 태그안에는 웹페이지에 보여줄 p 태그가 있다 style 태그 안쪽에 해시(#) 문자를 적고 id를 적어주고 해당 아이디의 내용을 중괄호 안에 적어준다 body 태그 안에 있는 p 태그중 id 값으로 paral 이 되어있는 p 태그에 위에서 설정한 내용으로 변경되어 웹페이지에 나타나는걸 확인할 수 있다 ※ ID 이름은 숫자로 시작할 수 없고 항상 시작태그에 들어가 있어야 한다 ※ CSS 클래스 선택자 위 사진에서 class 이름이 center인 모든 HTML 요소는 초록색으로 하고 가운데 정렬로 바꾸도록 한다 h1 과 p 태그 모두 class..
-
CSS 기초 - CSS정의, 기초구문프로그래밍언어/CSS 2023. 4. 2. 15:00
CSS란? CSS는 Cascading Style Sheets의 약자이다. CSS는 많은 작업을 저장하고 한 번에 여러 웹 페이지의 레이아웃을 제어할 수 있다 외부 스타일시트는 CSS 파일에 저장된다 CSS 구문 CSS 규칙은 선택기와 선언 블록으로 구성된다 선택기는 스타일을 지정할 HTML 요소를 가리키고 선언 블록에는 세미콜론으로 구분된 하나 이상의 선언이 포함된다. 각 선언에는 콜론으로 구분된 CSS 속성 이름과 값이 포함되고 여러 CSS 선언은 세미콜론으로 구분되며 선언 블록은 중괄호로 묶인다 위의 코드를 예로 들어 CSS의 기초 사용법에 대해 알아보겠다 태그 안에 태그가 들어가 있는 상태이고 태그 안에 있는 p는 선택기 이므로 안에 있는 모든 태그들을 선택해 준다 color는 속성이고 red속성 ..
-
HTML 기초 - HTML + CSS, 배경색, 글자색, 글꼴, 크기, 정렬프로그래밍언어/HTML 2023. 4. 2. 14:12
배경색 background-color를 powderblue 색으로 변경할 수 있다 각 단락마다 background-color 색을 지정해 주어 바꾸어 줬다 텍스트 색상 background를 빼고 color의 색상을 정해주면 해당 글자의 색이 바뀌게 된다 글꼴 font-family는 HTML 요소에 사용할 글꼴을 정해준다 텍스트 크기 font-size는 HTML 요소의 텍스트 크기를 정해준다 텍스트 정렬 text-align는 HTML 요소의 가로 텍스트 정렬을 도와줍니다 w3schools - html 공부내용 정리