# CSS

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

12665개의 포스트
post-thumbnail

HTML/CSS 스터디 요약

HTML/CSS 스터디

14분 전
·
0개의 댓글
·

🔥 자손 자식 선택자

자손선택자 자식, 손자, 후손 그리그 그 이후 모든 후손을 포함합니다.A B {속성 : 속성값}자식선택자 A > B {속성 : 속성값}

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

<flex>

22.12 2 오랜만에 시작하는 수업!! 오늘 배운 flex 너란놈.. 잘 써먹어봐야지!!! 오늘의 수업 flex > 1) 정렬 순서 (상단왼쪽정렬, 상단오른쪽정렬(역순), 하단왼쪽정렬, 하단 오른쪽정렬(역순), 자동으로 줄넘김(0,X) ) > 2) 배치하는 위치

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

가로배치

처음 css 할때부터 가로배치에 대한 스트레스를 너무 많아 받았다...언젠가 내가 이걸 파헤치겠다 라는 생각을 했는데 정리를 싹한다각각의 컨텐츠들은 추후에 더 자세히 글을 작성할것장점 : 자유로운 스타일과 움직임 가능단점 : inline이 적용이 되기 때문에 공간이 빔

어제
·
0개의 댓글
·
post-thumbnail

기나긴 여정을 위한 공부 (1주차)

사실 모든 것이 익숙하다.자바스크립트, HTML, CSS, 부트스트랩...다 이전에 공부할 때 한번씩 보았던 것이다.그러나 몇 가지 몰랐던 것들이 눈에 띄인다. background-image: url();background-position: center;backgrou

어제
·
0개의 댓글
·
post-thumbnail

CSS_selector

CSS(Cascading Style Sheet)은 마크업 언어로 작성된 문서의 모습을 '설명'하는 것. 레이아웃, 색상 및 글꼴을 포함하여 내용과 프레젠테이션을 분리할 수 있게 설계하여 콘텐츠 접근성을 향상시켜주는 역할을 한다. Author Style (CSS 제공)

어제
·
0개의 댓글
·
post-thumbnail

반응형 디자인

PC || Tablet영역들이 가로로 여러 줄 배치 됨Mobile영역들이 세로로 한줄 씩 배치 됨PC, Tablet, Mobile 등 각각의 기기별로 웹 페이지가 최적화되어 보여지는 기능.화면이 작은 기기에서는 작은 화면으로 최적화해서 보여주고 큰 화면을 가진 기기에서

어제
·
0개의 댓글
·
post-thumbnail

Css Grid 정리 🚗

Flex가 한 방향 레이아웃 시스템이라면 Grid는 두 방향(가로-세로) 레이아웃 시스템이다.Grid는 부모요소와 자식요소로 나뉜다 부모요소를 Container 자식요소를 item 이라 부른다간단하게 예제를 구현하면서 알아보자grid-template-rows: 150p

어제
·
0개의 댓글
·
post-thumbnail

CSS3 웹 페이지 레이아웃-2

📃콘텐츠 구성 출력 \#content 스타일 추가 출력 📃본문 구성 출력 \#main_section 스타일 추가 출력

어제
·
0개의 댓글
·
post-thumbnail

HTML + CSS

HTML 문서를 구성하고 있는 요소로 이름, 속성으로 이루어져 있다. &lt;a(이름) href(속성)="www.\~\~~.com"(속성값)>h1~6 : 타이틀이 될만한 부분p : 본문에 사용되는 태그로 단락을 구분i : 기울임sup : 작은 글자ins : 밑줄del

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

DAY4

오전에 1주차강의의 과제를 제출하고 출근했다.이전 강의에서 배운 내용들을 붙여넣기만하면 되는거라 많이 어렵진 않았다.퇴근하고 2주차 강의를 들었다.전에 만들었던 영화포스팅사이트가 껍데기 뿐이었다면 그걸 실제로 사용할수 있게 만드는 작업인것 같다.css작업만 했을때는 그

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

CSS textarea 하단에 자동으로 생기는 여백 없애기!

Chrome이나 Firefox 같은 브라우저에서 textarea를 사용할 때 분명 margin-bottom은 0인데 4px정도의 여백이 생기는 경우가 있습니다. 왜 여백이 생기는지, 그리고 어떻게 없앨 수 있는지 알아보겠습니다.

2일 전
·
0개의 댓글
·

CSS 개요

CSS 개요

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

CSS3 웹 페이지 레이아웃-1

레이아웃을 만들 떄 가장 중요한것은 공간 분할웹 페이지 구상웹 페이지 구성 영역 분리구성 영역을 행 단위로 분리나누어진 행의 내부 요소 분리 실제 웹 페이지를 만들 떄는 이렇게 style 태그를 많이 만들 필요가 없다.각 부분을 쪼개서 설명하기 위해 여러 개 만들었음초

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

TIL - 전화번호 입력칸 만들기 : 숫자 타입의 input의 최대 자릿수 제한하기

사용자가 전화번호를 입력할 때 지정된 전화번호 길이만큼만 입력할 수 있도록 제한하고 싶다!

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

CSS 기초 스터디 요약

CSS 기초 스터디

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

CSS Pseudo Element와 svg 태그

::after와 같은 CSS 의사 요소들은 인라인 svg 요소에 적용시킬 수 없는가?

2일 전
·
0개의 댓글
·

CSS transform

transform 속성을 사용하면 확대/축소, 이동 또는 회전시킬 수 있다.

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

CSS 카드 뒤집기 만들기

🔍 transform-style : preserve-3d란 transform-style : preserve-3d 를 적용하면 기본적으로 자식 요소들이 3D 공간에 배치 된다. 3D 효과를 먹이고 싶은 상위 컨테이너에 적용시키면 그 밑의 요소들에게 3D 효과가 먹여

2일 전
·
0개의 댓글
·