본문 바로가기

Web/CSS3

[HTML] <a href > 새 탭에서 링크 열기 태그안에 target='_blank' 속성을 추가해주면 링크를 클릭했을때 새탭에서 열 수 있습니다. See the Pen Untitled by Su Yong Park (@parkkingcar) on CodePen. 2023. 4. 12.
[html/css] 클릭 전/후/마우스오버, 하이퍼링크(a href) 글자 색 바꾸기, 밑줄 없애기 HTML에서 하이퍼링크는 유저가 링크 클릭으로 방문 전과 후의 색이 다르게 나타나고 밑줄이 생기기도 합니다. 이 하이버링크의 색깔을 바꾸는 방법과 밑줄을 없애는 방법에 대해서 정리하겠습니다. 하이퍼 링크 밑줄 없애기 먼저, 밑줄 없애기 입니다. HTML에서 링크를 생성하면 기본적으로 아래에 밑줄이 표시됩니다. See the Pen tistory_css1 by Su Yong Park (@parkkingcar) on CodePen. (css를 적용하지 않은 하이퍼링크) 이제 밑줄을 없애기 위해서 'text-decoration-line' 속성을 none으로 입력해주면 됩니다. text-decoration-line 속성은 다음의 4가지 값을 가질 수 있습니다. - none : 선 없음 - underline : .. 2022. 9. 15.
css 다크모드 다크모드란? 다크 모드(dark mode)는 야간에 눈을 편안하게 하고 작업의 집중도를 높을 수 있도록 사용자 인터페이스에서 밝은 화면에 검은 글자 대신 어두운 화면에 흰 글자를 나타내는 테마입니다. 현재 대부분의 OS에서 지원을 하고 있으며 많은 앱과 웹사이트가 운영체제의 모드에 맞추어 어두운 계열의 스타일을 추가하고 있습니다. 웹 페이지를 다크모드로 만들려면 다음과 같은 클래스명을 만들어 js로 적용시켜주면 됩니다. .dark{ background: #212529; color: white; } 미디어쿼리 문법을 사용하면 더욱 편리하게 다크모드를 적용할 수 있습니다. @media (prefers-color-scheme : dark) { .nav{ background: #212529; color: whi.. 2022. 7. 8.