# CSS

종속형 시트 또는 캐스케이딩 스타일 시트는 마크업 언어가 실제 표시되는 방법을 기술하는 언어로, HTML과 XHTML에 주로 쓰이며, XML에서도 사용할 수 있다. W3C의 표준이며, 레이아웃과 스타일을 정의할 때의 자유도가 높다.

10144개의 포스트
post-thumbnail

CSS(2)

CSS 선택자 내부 외부에서 문서의 html 요소를 선택하는 문법 tag 선택자 : html 문서의 모든 특정 태그를 선택할 때 사용 id 선택자 : html 문서의 하나의 요소를 특정해서 선택할 때 사용 class 선택자 : html 문서의 여러 요소를 그룹으로 선택할때 사용 tag 선택자 html 태그의 이름으로 바로 선택가능 태그 이름 그대...

약 7시간 전
·
0개의 댓글
post-thumbnail

CSS align과 unit, viewport

align, unit, viewport

약 10시간 전
·
0개의 댓글
post-thumbnail

[react] 회원가입 form 꾸미기 #1 - material Icon 을 Props 로 전달받기

본격 날것의 디자인에서 css 를 입히는 중이다. emotion 을 사용하고 material icon 을이용해 회원가입 폼을 꾸미려고 한다. material icon 또한 npm 을 이용해 설치를 해주었다. 아이콘은 컴포넌트 형태로 가져 올 수 있어 편했다. (따로 이

약 10시간 전
·
0개의 댓글
post-thumbnail

Animation 연속으로 적용하기

element.getAnimation() 살펴보기

약 11시간 전
·
0개의 댓글

의사 클래스 중첩해서 적용하기

의사 클래스(가상 클래스)는 CSS를 적용할 때 클래스 선택자나 태그 선택자에 추가해 선택한 요소가 특별한 상태일 때의 스타일을 적용하는 방식입니다. 클래스나 태그로 선택자를 선택하고 스타일을 적용할 때는 DOM에 이미 정의된 요소로 선택하지만 의사 클래스를 사용하면

약 11시간 전
·
0개의 댓글

HTML 한글 글꼴

Value : \[ | \*] | inheritInitial : depends on user agentApplies to : all elementsInherited : yesPercentages : N/AMedia : visualComputed value : as s

약 17시간 전
·
0개의 댓글
post-thumbnail

BootStrap 5 Basic

Colors background color Borders List Style Flex items Flex 활성화 .d-flex .d-flex-inline .d-flex 및 .d-inline-flex에 대한 반응형 변형도 있다. 팽창과 축소 .flex-grow

약 18시간 전
·
0개의 댓글
post-thumbnail

[백엔드 로드맵 - FE] CSS

이번 포스팅은 CSS에 관한 포스팅이다. HTML에 이어서 프론트엔드의 기초를 다지는 데 몰라서는 안 되는 지식이고 모르면...열심히 공부해야 한다. 정말로.Cascading Style SheetCascade라는 단어는 '종속'이란 의미를 가진다. HTML 문서에 '종

약 18시간 전
·
0개의 댓글
post-thumbnail

(3) Ping coming soon page

이 솔루션은 Ping coming soon page challenge on Frontend Mentor 참여 결과물입니다.

약 19시간 전
·
0개의 댓글
post-thumbnail

css-in-js와 in-css 중에서 어떤 방식이 더 적합할까?

css in css와 Js 중에서 어떤게 더 좋은 방법인지 알아보았습니다.

약 19시간 전
·
0개의 댓글

WebDevelop 수업 - Day12 FLEX, GRID

개발자 도구 > element : html/css 의 구성이 어떻게 되어있는가 console : javascript ( 기능 구현 ) network : 서버에 대한 것. 통신방법, 응답코드는 무엇인지.. > 요소가 어디에 있는지 하이라이트 해준다. ![](https:

어제
·
0개의 댓글
post-thumbnail

CSS position

position

어제
·
0개의 댓글
post-thumbnail

CSS (1)

CSS CSS(Cascading Style Sheets) CSS(Cascading Style Sheets): html웹 문서의 스타일을 표현하는 언어로 HTML 코드로 작성 된 웹 요소들이 어떻게 표시되어야 할지를 정의한다. CSS 구성 요소 : 선택자 (selector, CSS속성, CSS속성값) CSS구조 화면 상의 HTML로 이루어진 요소에 대...

어제
·
0개의 댓글
post-thumbnail

CSS list와 display

list와 display

어제
·
0개의 댓글
post-thumbnail

CSS 박스 모델과 overflow

박스 모델과 overflow

어제
·
0개의 댓글
post-thumbnail

TIL:22 Pseudo Selectors

pseudo element들은 :(콜론)이 2개인 게 특징입니다.1) :: placeholder (0:46): placeholder의 특성만 바꾸고 싶을 때 사용합니다.2) :: selection (1:31): 클릭해서 긁을 때(1:58) 발생합니다.3) :: firs

1일 전
·
0개의 댓글

로딩 상태를 나타내는 진행바 만들기

메인 페이지에서 상품 리스트를 모두 가져올 때, 사용자에게 현재 데이터를 가져오는 중임을 표시하는 로딩상태 바를 만들고 싶습니다.진행바를 만들기 위해서는 바를 나타내는 요소의 width 값이 필요합니다.이 width 값은 로딩 상태의 %를 나타내는데, 문제는 로딩 상태

2일 전
·
0개의 댓글
post-thumbnail

[프로젝트 회고] 배달의 민족 for Web

제로베이스 프론트엔드 스쿨 오프라인 과정 4주차 HTML/CSS 프로젝트

2일 전
·
0개의 댓글
post-thumbnail

HTML,CSS 여행사이트 만들기

여행사이트그동안 공부한 html,css 웹 퍼블리싱 강의를 듣고 여행 사이트를 만들었다 저번주에 처음 자기소개 페이지를 만들때는 완전 멘붕에 힘들었는데 이번엔 저번 보다 그래도 30프로 정도 덜 멘붕이왔다 계속 하나씩 페이지를 만들어가면 나중에는 뚝딱 해낼수있을것같다

2일 전
·
0개의 댓글

HTML,CSS

일반적으로는 외부 CSS 파일에 스타일을 쓰고 HTML 코드에서 태그로 연결해주는 것이 가장 좋은 방식이다. 하지만 조금씩 새로운 스타일을 시도해볼 때에는 간편함을 위해서 < style>태그를 쓰는 방법 또는 style 속성에서 테스트를 하고, 나중에 외부 CS

2일 전
·
0개의 댓글