목록개발 공부 (76)

열정 실천

[CSS 005] 글자를 표현하는 다양한 스타일

color 색상 변경 font-style 폰트의 스타일 - 주로 기울임꼴 표현을 위해 사용(italic, oblique) font-weight 글자의 두께(100부터 900까지) font-variant:small-caps; 주로 대소문자를 강제로 변환하는 용도로 사용 (대문자는 그대로, 소문자는 크기가 작은 대문자로) font-size 폰트 크기 지정 font-family 글꼴 변경 text-align 글자의 정렬 방향 지정 (left, right, center) font-decoration 글자에 밑줄을 그을 때 사용 (underline, overline, line-through) 💡예시 💡결과 💡예시 💡결과
개발 공부/CSS 2023. 3. 23. 21:16
[HTML 004] 블록과 인라인

html의 모든 요소는 해당 요소가 웹 브라우저에 어떻게 보이는가를 결정하는 display 속성을 가진다. display 속성의 값으로 inline과 block, 그리고 두 가지의 장점을 합친 inline-block이 있다. inline ✔ html 태그의 내용 만큼만 차지 ✔ 태그를 연달아 썼을 때 한 줄에 나타남 ✔ width, height로 크기 조절을 할 수 없음 ✔ 좌우 margin, padding만 적용 가능 (상하는 불가능) 📌인라인 태그 종류 , , , , block ✔ 해당 라인의 모든 너비를 차지 ✔ 태그 요소마다 줄을 바꿈 ✔ width, height, 상하좌우 margin, padding이 모두 가능 -> 레이아웃을 작업하는 요소로 적합 ✔ 내용과 별개로 자신의 영역을 가짐 📌블록 ..
개발 공부/HTML 2023. 3. 23. 14:22
[CSS 004] 색상 속성

CSS가 색상을 표현하는 3가지 방법 1. 색상 이름 ========색상 이름 찾기 사이트======== CSS/Properties/color/keywords - W3C Wiki Color keywords Basic Colors Named Numeric Color name Hex rgb Decimal black #000000 0,0,0 silver #C0C0C0 192,192,192 gray #808080 128,128,128 white #FFFFFF 255,255,255 maroon #800000 128,0,0 red #FF0000 255,0,0 pu www.w3.org ================================= 2. RGB (RGBA) 코드 3. 16진수 색상 코드
개발 공부/CSS 2023. 3. 18. 20:26
[CSS 003] 스타일의 중첩과 Cascading(캐스케이딩)의 의미

한 개의 p{ border: solid; bolder-color:red} p{ bolder-color:green} 이렇게 CSS 코드가 중복될 경우에는 항상 마지막에 입력된 명령이 실행된다. 하지만 이렇게 코드의 등장 순서를 이용하여 과거의 CSS 코드를 강제로 덮어씌우는 방법은 좋은 방법이 아니다. 캐스케이딩을 이해한다면 더 효율적으로 프로젝트를 관리할 수 있다. CSS는 "Cascading Style Sheet"의 줄임말이다. CSS에서 말하는 Cascading은 스타일이 쏟아져 내리는 것을 의미한다. ------------------------------------------------------작성중-------------------------------------------------------..
개발 공부/CSS 2023. 3. 18. 20:18
[CSS 001] CSS를 적용하는 3가지 방법

1. 태그 안에 style 속성 부여하기 아래와 같이 태그 안에 style 속성을 부여하여 CSS를 적용할 수 있습니다. 기본형 예시 ................................................................................................................................................................ 2. style 태그를 활용하기 기본형 예시 ...........................................................................................................................................
개발 공부/CSS 2023. 3. 18. 19:59
[CSS 000] CSS 시작! - 선택자의 종류와 사용법

우리가 작성한 HTML파일에서 특정 부분만 딱 골라 CSS를 적용하여 꾸며야하는데 그 부분을 어떻게 구분하여 적용할까요? CSS는 선택자를 이용하여 특정 부분을 골라냅니다. 기본 규격은 아래와 같습니다 . (선택자) { (스타일 속성1): (스타일 값); (스타일 속성2): (스타일 값); } 선택자에는 태그, 클래스, 아이디가 있습니다. 각각을 선택자로 이용할 때에는 각각의 명칭 앞에 붙는 기호가 다릅니다. 태그 : (태그 명) 클래스 : .(클래스명) 아이디 : #(아이디 명) 선택자01. 태그 (태그 명) { ... } html을 작성할 때 사용한 태그를 그대로 선택자로 활용합니다. 그러면 해당된 모든 태그를 대상으로 CSS가 작동하게됩니다. 예시 가장 넓은 범위에 동시다발적으로 디자인을 적용할 때..
개발 공부/CSS 2023. 3. 18. 19:58
이전 Prev 1 ··· 3 4 5 6 7 8 9 ··· 13 Next 다음