CSS 3

간단한 css 모서리 둥글게 하기 border-radius(ft. 티스토리)

오늘은 간단하게 티스토리 css 코드를 수정하는 방법을 알아보겠습니다. 최근에 아주 오랜만에 티스토리의 스킨을 변경하였는데요 기존에 전체 커스텀했던 스킨을 기본 스킨으로 변경을 하니까 어딘가 조금씩 심심하고 아쉬운 부분들이 보이더군요 그래서 앞으로 조금씩 스킨을 수정해보려고 하는데요 오늘은 그 첫번째로 메인 화면에서 리스트 썸네일 모서리를 부드럽게 둥글게 수정하는 방법을 알아보겠습니다.티스토리 css 수정하기아래 캡쳐 이미지를 보시면 우측의 썸네일 모서리가 직각인 것을 보실 수 있습니다. 너무 각이져있다 보니 부드러운 느낌으로 수정을 하고 싶은데요 어떤 부분의 css를 수정해야 하는지 추적해보도록 하겠습니다.수정위치 찾기먼저 크롬 브라우저를 기준으로 설명을 드리면 수정하고자 하는 요소에 마우스를 가져다 ..

프로그래밍/css 2025.04.05

포커스 파란색 보더 없애기 focus outline 제거 CSS

html 태그를 사용하다 보면 파란색 외곽선이 생기는 것을 볼 수 있다. 이는 button, a, select 등 form 요소 태그가 가지는 기본 속성이지만 경우에 따라서 이 파란색 보더를 없애고 싶을 때가 있다. 바로 없애보자. button { outline: 0; } a { outline: 0; } select { outline: 0; } /*한번에 처리*/ button, a, select { outline: 0; } 참 쉽죠? 앞으로 CSS 꿀팁은 계속됩니다.

프로그래밍/css 2020.04.24

css선택자 [class*="name"] class다중선택

무려 4개월 만에 돌아온 css 강좌입니다. 날마다 오는 클라스가 아니여~ 오늘은 css 선택자 중 하나인 class 선택자에 대해서 알아보겠습니다. 이 class 선택자는 내가 지정한 class중에서 동일한 문자를 포함하고 있는 클래스들을 모두 선택해줍니다. 기본적으로 아래와 같이 요소를 선택해서 스타일을 주는데요 .name{height:100px;} 아래와 같이 중복되는 스타일을 가진 요소들이 있을 때 단순하게 아래와 같이 작업을 하는 경우가 있었을 겁니다. 1 2 3 4 5 .name1,2,3,4,5라는 요소에 height라는 공통적인 스타일이 있습니다. 저렇게 사용해도 상관은 없지만, 나중에 유지보수할 경우 똑같은 일을 5번 반복해야하는 상황도 생기고 코드가 불필요하게 길어지면서 지저분해보이기까지..

프로그래밍/css 2019.12.20