2020-11-09 게시 됨2021-08-04 업데이트 됨web몇 초안에 읽기 (약 52 단어)

inline style vs !important

!important 승

갑자기 인라인에서 정의한 스타일과 !important 중에 누가 더 강력한지 궁금해 졌다

1
2
3

h1 {
  color: red !important;
}

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <h1 style="color: blue">hello world</h1>
  </body>
</html>

2020-11-03 게시 됨2021-08-04 업데이트 됨web몇 초안에 읽기 (약 26 단어)

li point remove

default.css

1
2
3

li {
  list-style-type: none;
}

li의 앞에 붙는 . 을 없앨 수 있다

2020-11-02 게시 됨2021-08-04 업데이트 됨web몇 초안에 읽기 (약 85 단어)

awesome button css

Button With Awesome Hover Effects using Html CSS & jQuery | mouseenter and mouseout events
위 영상을 보고 따라 만들었다
영상에서는 제이쿼리를 사용해서 구현하지만, 나는 제이쿼리없이 구현해보았다

결과

참고 ; 소스코드

2020-10-08 게시 됨2022-01-08 업데이트 됨web몇 초안에 읽기 (약 106 단어)

a tag no color

no color

a {
  color: inherit;
}

a:hover {
  color: blue;
}

a tag는 보통 파란색으로 표시되고, 해당링크에 방문한적이 있으면 색이 달라진다
아이콘 같은 곳에 링크를 걸었을때 이러한 특징으로 인해 약간 보기싫어지는 경우가 있는데 이를 해결할 수 있다

no underline

1
2
3

a {
  text-decoration: none;
}

2020-09-18 게시 됨2020-09-26 업데이트 됨web몇 초안에 읽기 (약 18 단어)

css !important

example

1
2
3

div {
  color: blue !important;
}

무적기… 근데 권장하진 않는다!

2020-09-18 게시 됨2021-07-12 업데이트 됨web몇 초안에 읽기 (약 1 단어)