ijooha 님의 블로그

sticky 알아보기         sticky란? 스크롤을 내렸을 때 화면 위에 딱 달라붙어 사라지지 않는 position값이다.position의 값에는 sticky 외에도 fixed, relative, absolute, static 등이 있다. 언제 사용할까?네비게이션이나 목차, 버튼을 화면에 고정시키고 싶을 때 사용한다.         sticky를 사용하기 위한 기본 CSS css 파일에서 고정시키고 싶은 요소에 아래와 같이 작성하면 된다.position: sticky;top: 0; //고정시키고 싶은 위치 지정          sticky를 사용하기 위한 조건 sticky가 작동하려면 아래 몇가지 조건이 만족되어야 한다. 01 부모 요소의 길이sticky가 작동하기 위해서는, 부모요소의 길이가 ..

CSS 기본 구조와 선택자 알아보기         기본 개념 html에서 몸통 만들어줬다면 이제 옷을 입히고 꾸며줄 차례다.그러기 위해 css를 사용하는데, Cascading Style Sheet라는 뜻이다.스타일 시트를 사용하는 여러가지 방법이 있다.그중 외부에 코드를 작성하고 html에 링크를 삽입하여 연결하는 방법이 가장 좋다쪽에 이런식으로 연결해주면 된다. css 파일은 같은 폴더에 있는 게 좋다.다른 폴더에 있어도 가져올 순 있다.         기본 구조 h1 {color: white;}선택자 {속성: 값;} 이런식으로 스타일을 적용할 대상(선택자)를 정하고, 속성을 사용해 다양하게 꾸며준다.선택자는 id, class, tag 등이 될 수 있고, 속성은 종류가 굉장히 많다.속성중에서 중요한 부..