반응형 Study with Yedol/CSS18 CSS 글자 스타일 적용 이번 시간에는 글자 스타일을 적용하는 방법에 대해 다뤄볼 것이다. 글자에는 기울기, 폰트, 글자선, 그림자 등 다양한 스타일을 적용할 수 있다. 이러한 글자의 스타일들은 기본적으로 font와 text 속성을 이용하여 적용할 수 있다. 둘 다 같은 글자를 의미하는데 어떤 때는 font 속성을 어떤 때는 text 속성을 써야 하는 걸까? font 속성과 text 속성의 차이 font 속성은 글자의 디자인적 요소를 적용하는 것이고, text 속성은 글자의 배치와 효과를 적용하는 것이다. 차이만 봐서는 이해하기 어려우니 예제를 들면서 설명하도록 하겠다. 그럼 지금부터 글자 스타일 적용하는 방법 시작!!~ 1. font 스타일 : 글자의 글꼴, 기울기, 굵기 등 디자인적 요소를 변경하는 속성이다. (1) font.. 2023. 12. 26. CSS 색상 변경 방법 지금까지 CSS 예시를 들면서 가장 많이 속성 값에 대해 다뤄보았다. CSS에서 색상을 변경하려면 아래와 같이 코드를 해야 한다. 요소 { color : 속성값; } 이전까지는 color 속성 값에 대해 빨간색이면 red , 파란색이면 blue 이렇게 키워드를 입력해서 color 속성값을 적용해 왔다. 앞으로는 오늘 다룰 내용인 CSS 색상 변경 방법을 배운다면 다양한 color를 적기에 쓸 수 있을 것이다.!! 그럼 CSS 색상 변경 방법 스타트! CSS color 속성값을 적용하는 방법에는 4가지가 있다. 흔히 아는 색상 이름부터 hex, rgb, hsla가 있다. 그러면 우리가 잘 알고 있는 색상 이름(키워드)부터 시작하겠다. 공통 HTML 코드 색상을 적용하는 방법 4가지 1. 색상 키워드(이름).. 2023. 12. 23. CSS문법 Combinators(결합자, 선택자) 결합자(Combinators)란? 선택자들의 간의 관계를 설정해주는 것이다. 관계를 설정해준다..? 라는 말이 조금은 이해가 되지 않는다. 쉽게 말하면 연관관계가 있는 예를 들면 부모자식 간의 관계를 어떤 결합자(부호)를 써서 설명한다는 것!! 결합자는 4가지가 있다. (사실 세부적으로 나뉘면 더 나눌 수 있고 줄이면 줄일 수 있지만 나는 w3school 기준으로 4개로 설명하겠다ㅇㅅㅇ) (공통) HTML 코드 combinators | 결합자 | 조합자 아이브 뉴진스 엔믹스 에스파 카리나 윈터 닝닝 지젤 1. Descendant Selector ( 하위 선택자 | 자손 선택자 | 자손 결합자) : 해당 요소의 하위 요소 중에서 특정 요소를 모두 선택하는 것이다. 상위 하위 { 속성 : 속성값; } 으로 .. 2023. 12. 22. CSS 문법 선택자의 종류 하........ 열심히 글 썼는데 또 날아갔다 티스토리는 왜 사진만 올리면 이렇게 날아가는지 가끔 사진 올리기 전에 임시저장을 누르지 않고 붙여 넣기를 하면 그렇게 날아간다.......... 후................................... 이렇게 된 거 다시 배운 내용 복기하고 시간도 날리고 좋다~ 무튼! 지난 포스팅에 CSS에 적용방법 3가지에 대해 배워보았다. 3가지를 배웠지만 실 사용은 대부분 링킹 스타일을 하므로 앞으로 포스팅할 CSS의 대부분은 링킹 스타일 적용 방식을 써서 진행할 것이다. CSS의 display 속성도 배웠고 CSS의 적용방법도 배웠으니 이제 CSS의 선택자만 배운다면 CSS의 뼈대는 완성을 하는 것이다.!! 서론이 너무 길었고 오늘은 CSS의 선택자에 대해.. 2023. 12. 21. 이전 1 2 3 4 5 다음 반응형
