# CSS

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

6142개의 포스트
post-thumbnail

Kokoa Clone 강의를 보고 배운것들 정리

반복되는 css는 components폴더에 저장 반복되지 않는 css는 screens에 저장justify-content: space-between; (item 3개)일때 가운데 item을 가운데로 두는법 (css hack)item의 width를 33%로 만들기2번째 i

약 4시간 전
·
0개의 댓글

CSS

웹에서 고치고 싶은 부분이 있다면 F12 -> toggle toolbar와 Dev tools를 통해 해당 component의 이름과 에러 상황을 파악한 후 css에서 수정ex. navbar가 중앙정렬 안되는 오류\-> Dev tools 통해 navbar-collapse

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

TIL: CSS

display: none 일 때 animation 효과를 사용할 수 없다.visibility 또한 마찬가지이다.opacity를 조절해준다.요소를 표시할 수 있으나 공간을차지하고 클릭을 함에 따라 다르다.참고 블로그: https://blog.hyungsub.co

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

Box model , Box Sizing , Box

HTML에 있는 모든요소는 CSS로 표현할 때 box로 표현이됨. 박스모델은 크게 content padding, border, margin으로 나누어짐컨텐트가 들어가 있는 상자이며 가로는 width, 세로는 height로 표현컨텐트와 테두리(border) 사이에 있는

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

CSS Selector

html 태그를 직접적으로 지칭하여 사용하는 방법사용예시해당 html태그에 class라는 attribute를 설정후 값을 넣음.그 이후 해당 class 값을 이용하여 해당 특정 class의 html태그를 지칭하는것이 가능class의 경우 중복되게 class값을 줄 수

약 10시간 전
·
0개의 댓글

Header Scroll Action_ Code

1\. html code2\. jquery3\. JavaScript4\. CSS code

약 12시간 전
·
0개의 댓글

[HTML/CSS] 다 알고 있다고 생각했지만 간과하고 있던 것들 2

1. position 내가 만든 영역을 2차원 평면의 공간으로 할지, 3차원 공간의 영역으로 할지를 결정짓는 요소입니다. 1-1. 2차원과 3차원의 차이 ||2차원|3차원| |:---:|:---:|:---:| |부모 자식 지간에 발생하는 마진 병합 현상|O|X| |top, left, right, bottom|X|O| |자식의 높이값이 부모의 높이값에 ...

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

[HTML/CSS/JS] 웹 프로젝트.

[HTML/CSS/JS] 웹 프로젝트.

약 15시간 전
·
0개의 댓글

video : 동영상 삽입하기

video 태그를 이용한 일반 동영상 삽입 / 유튜브 영상 삽입 / 배경영상 삽입하기

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

[React #9] styled-components로 효과적인 스타일링

현대 앱이 컴포넌트를 기반으로 발전해가면서 CSS 스타일링 방법론 또한 '컴포넌트를 기반'으로 재구성되고 있다. 이러한 발전 속에서 등장한 패러다임이 'CSS-in-JS'이며 그 중 가장 인기있는 라이브러리가 'sytled-components'이다. CSS in JS

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

css의 우선 순위

css는 html에 스타일을 입히는 스타일시트 언어이며 우선순위에 따라 스타일이 입혀지는 형태로 구성되어 있다. css의 우선 순위는 선택자에 따라, 작성된 위치에 따라, !important의 유무에 따라 정해진다.css의 선택자는 태그명, 아이디, 클래스, 추상 클래

어제
·
0개의 댓글
post-thumbnail

Flexbox

flexbox는 행과 열 형태로 항목 무리를 배치하는 일차원 레이아웃 메서드이다.각 항목은 부족한 공간에 맞추어 늘리거나 줄여서 여분의 공간을 채울 수 있고 비울 수 있다.flexbox의 적용 방법은 적용할 레이아웃의 부모 요소에 display 속성값을 flex로 주면

어제
·
0개의 댓글
post-thumbnail

TIL 29 | Styled-Components

sass냐 styled-components냐 그것이 문제로다...🤔

어제
·
0개의 댓글
post-thumbnail

CSS 셀렉터(선택자)

셀렉터는 style을 적용하고자 하는 html요소를 셀렉터로 특정하고 선택된 요소에 스타일을 정의하는 것이다.html 문서내의 모든 요소를 선택한다.지정된 태그명을 가진 요소를 선택한다.셀렉터(id명) 앞에 셀렉터(class명) 앞에 .을 붙여야 한다.지정된 어트리뷰트

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

Westagram - 2. main page html/css/Js

🌈 Instagram clone코딩을 해보았다. 🌀 main page 👉 main페이지 댓글을 입력할 경우에 댓글창에 댓글이 입력되게 구현해보았다.

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

HTML & CSS | 미니 프로젝트 - Free Gallery (2021.08.30 ~ 2021.09.03)

링크: Free GalleryHTML, CSS를 활용하여 배운걸 사용하되, 멋있고 화려하게 구현하자는 목표를 가지고 정적 웹페이지를 만드는 프로젝트를 시작하였습니다. 아직 자바스크립트를 배우기 이전이기 때문에, 약간의 java script를 사용하여 DOM요소를 제어했

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

CSS 선택자, 우선순위

여러 종류의 선택자와 선택자 우선순위에 대해 소스코드와 함께 알아보자.

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

CSS 박스모델

모든 태그들은 각자의 영역을 가지며 이 영역은 너비와 높이를 가지는 박스 형태를 취한다.너비와 높이는 width와 heigth로 설정할 수 있으며 max와 min으로 최댓값과 최솟값을 설정할 수도 있다.max-width(heigth) : 해당 html 요소가 가질 수

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

자주 사용하는 CSS 속성값 정리

CSS에서 자주 사용하는 속성값을 정리한 내용이다.css에서 색을 표현하는 방법에는 색상 이름으로 표현, RGB 색상값으로 표현, 16진수 색상값으로 표현 3가지 방법이 있다.표준 색상 명을 입력하여 표현한다.RGB의 범위인 0~255까지의 숫자로 조합된 색 표현 방식

2일 전
·
0개의 댓글