메모장을 사용하여 간단한 CSS 스타일시트를 만드는 방법

작가: Clyde Lopez
창조 날짜: 20 칠월 2021
업데이트 날짜: 1 칠월 2024
Anonim
#5 꾸밈을 담당하는 CSS의 문법과 연결 방법 3가지 - 웹 코딩 강좌
동영상: #5 꾸밈을 담당하는 CSS의 문법과 연결 방법 3가지 - 웹 코딩 강좌

콘텐츠

메모장은 CSS(Cascading Style Sheet) 문서를 만드는 데 사용할 수 있는 텍스트 편집기 중 하나입니다. 메모장에서 CSS 파일을 만든 후 해당 파일을 웹 페이지에 링크하여 웹 페이지의 내용을 스타일시트로 형식화할 수 있습니다.

단계

  1. 1 메모장 프로그램을 엽니다.
  2. 2다음 코드를 복사합니다.

@charset "utf-8"; / * CSS Document * // * body 요소의 색상 정의 * / body {background: # FFFFFF;} / * 이 섹션은 링크용입니다. * / a: link { 글꼴 두께: 보통; color: Navy} a: 방문 {font-weight: normal; color: Green;} a: hover {font-weight: bold; 색상: 레드; font-variant: small-caps;} / * 이 섹션은 단락 섹션에 대한 것입니다. * / p {font-style: italic; font-size: 18px;} blue {color: # 0000FF;} / * 이미지의 검은색 테두리 부분입니다. * / img {border-color: # 000000; 테두리: 두꺼운; 테두리 스타일: 능선;}

# "Step 2"의 코드를 메모장에 붙여넣습니다.


  1. 1 메모장에 파일을 저장합니다. "파일" 버튼을 클릭하고 "저장" 명령을 선택하여 "SimpleCSS.css"라는 이름으로 저장합니다. "저장" 버튼을 클릭하면 "다른 이름으로 저장" 대화 상자가 표시됩니다.
  2. 2 CSS 파일의 이름을 지정합니다. "SimpleCSS.css" 또는 "파일 이름" 텍스트 상자에 확장자가 ".css"인 이름을 입력합니다.
  3. 3 "저장" 버튼을 클릭합니다.
  4. 4 완료되었습니다!

  • 메모장 파일을 텍스트 전용(텍스트 문서 또는 ASCII라고도 함)으로 저장하고 확장자 ".css"를 지정합니다.
  • 여기에 작성한 코드는 메모장을 사용하여 기본 CSS 파일을 생성하여 소개 섹션에 표시된 샘플 웹 페이지에서 HTML 요소를 조작하는 방법을 보여주는 예일 뿐입니다. 그러나 웹 페이지의 스타일과 모양의 형식을 지정하는 방법은 CSS 코딩을 변경할 수 있습니다.
  • 웹 페이지를 만든 HTML 문서와 동일한 폴더에 저장된 CSS 문서를 저장하는 것을 잊지 마십시오.
  • CSS 문서를 만든 후 다음 단계를 수행해야 할 수도 있습니다. 즉, 문서와 웹 페이지를 연결합니다. 이를 수행하려면 관련 기사를 참조하십시오.

필요한 것

  • 컴퓨터
  • 메모장 프로그램
  • 인터넷 브라우저