LESS - multiple different classes with the same style?

孤街浪徒 提交于 2019-12-24 05:54:43

问题


How would you write this style below in LESS?

nav a:hover,
nav a:focus,
footer a:hover,
footer a:focus,
.fullscreen-container a:hover,
.fullscreen-container a:focus {
    text-decoration: none;
}

My attempt:

.text-decoration-none () {
    text-decoration: none;
}

nav a {
    &:focus,
    &:focus {
        .text-decoration-none ();
    }
}

footer a {
    &:focus,
    &:focus {
        .text-decoration-none ();
    }
}

.fullscreen-container a {
    &:focus,
    &:focus {
        .text-decoration-none ();
    }
}

Result:

nav a:focus,
nav a:focus {
  text-decoration: none;
}
footer a:focus,
footer a:focus {
  text-decoration: none;
}
.fullscreen-container a:focus,
.fullscreen-container a:focus {
  text-decoration: none;
}

Ideal result:

nav a:hover,
nav a:focus,
footer a:hover,
footer a:focus,
.fullscreen-container a:hover,
.fullscreen-container a:focus {
    text-decoration: none;
}

Any ideas?


回答1:


nav, footer, .fullscreen-container {
  a {
    &:hover, &:focus {
      text-decoration: none;
    }
  }
}



回答2:


.text-decoration-none () {
    text-decoration: none;
}

nav a, footer a, .fullscreen-container a {
    &:hover,
    &:focus {
        .text-decoration-none ();
    }
}


来源:https://stackoverflow.com/questions/40310268/less-multiple-different-classes-with-the-same-style

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!