# CSS
종속형 시트 또는 캐스케이딩 스타일 시트는 마크업 언어가 실제 표시되는 방법을 기술하는 언어로, HTML과 XHTML에 주로 쓰이며, XML에서도 사용할 수 있다. W3C의 표준이며, 레이아웃과 스타일을 정의할 때의 자유도가 높다.
HTML/CSS (1)
안에 내용은 태그 안에 적어야 한다. 글제목은 태그 , 내용은 태그 안에 항목1 항목2 -> 리스트만들기! 리스트 예제 태그 안에 태그 넣을 수 있음.
Project 1. html,css로 간단한 웹페이지 만들기 (진행중)
생활코딩 강의에서 배운 html, css 개념을 복습하기 위한 목적을 가진 프로젝트이다!1\. 어떠한 웹페이지를 만들 것인가?\-> 친구들이랑 강릉 여행을 갈 때 사용할 웹페이지를 만들 것이다.2\. 어떠한 내용이 들어갈 것인가?\-> 맛집, 관광명소, 호텔에 관한 정
CSS로 X 버튼 그리기(feat.styled-components)
프로젝트에서 x버튼 디자인이 각각 다른 사이즈, 두께로 나와서 스타일 컴포넌트를 정의해 버튼 폭을 입력받아 만들도록 했다. 매번 비슷한 스타일 컴포넌트를 정의하지 않고 버튼의 크기와 선의 두께를 받아 그려주도록 만들었다. 세로로 서있는 직선 두개를 가상 요소 befor
[CSS] 파일 연결과 selector
<head></head> 안에 <link rel="stylesheet" href="파일명"/>을 작성하여 해당 css파일을 연결한다.selector는 대상을 선택할 수 있다.형태는 다음과 같다.클래스를 선택할 때는 클래스 이름 앞에 .을 붙인다.male
마우스오버효과 이미지에넣기
★ opacity:0 -> 1 (투명도) position:absolute; ★ https://codepen.io/1000mj/pen/ZEjqWew
HTML / CSS 공부
https://gymcoding.notion.site/HTML-CSS-706749085a29449bb066957e56686365
반응형 사이트 강의 TIL - 2
html5 shiv : ie6~8에서 새로운 태그 인식 시켜주기 위함 modernizr -> 현재 브라우저에서 뭘 사용할 수 있는지 확인 가능
SASS 개념 및 문법 정리
SASS는 CSS전처리로 이 외에도 less나 styles등이 존재한다. 웹에서는 CSS만 동작하기 때문에 CSS 전처리기는 직접 동작할 수 없다. 따라서 전처리기로 작성한 경우 CSS로 컴파일하는 작업이 필요하다.
[Web KIT640] Day 05. Firebase 및 node.js를 활용한 웹 페이지 배포
Introduction 정리 position : relative 요소 자기 자신을 기준으로 배치 position : absolute 부모(조상) 요소를 기준으로 배치 transfrom-origin 물체를 회전할 때 중심점을 결정한다. 기본 값은 center, ce
CSS - 박스 모델/레이아웃/transform
#프론트엔드 #frontend #프론트엔드스쿨 #프론트엔드공부 #개발공부 #프론트엔드개발자 #취준일기 #취준기록 #취뽀 #빡공 #제로베이스
styled-components[React]
styled-components? 리액트에서 컴포넌트에 css 스타일링을 적용하기 위한 플러그인 css 요소를 자바스크립트 파일에서 한번에 관리 가능 Features 컴포넌트가 렌더링되는 요소에만 스타일 주입 -> 로딩시 필요한 코드 양 감소 클래스 네임 중복 문제를
코드스피츠 스터디 - CSS Rendering 1회차 정리 및 리마인드
히카맹 선생님의 코드스피츠 강의를 들으며 자바스크립트에 대한 이해를 높이기 위해 스터디를 하게 되었다. 이 포스팅은 그에 대한 정리글이다.히카맹 선생님의 코드스피츠 강의를 듣고 포스팅한다고 말한 지 어느덧 한달이다. 사실 다 듣고는 있었는데 (스터디를 하니까 .. )
[CSS]강의 (1) Box
Box Model content 가로는 width, 세로는 height padding 안쪽여백 border 테두리 border: 굵기 스타일 색상 border: 1px solid black; border-top:1px solid bla
styled-components에서 css 리셋 적용하는 법
styled-components에서 css 리셋하는 코드는 하기와 같다. styled-reset 라이브러리에서 css 부분만 가져와서 createGlobalStyle에 붙여넣어주면 된다. 참고: https://github.com/zacanger/styled-rese