如何设置w3.css框架中的链接样式?

时间:2017-05-19 00:56:31

标签: css responsive-design

我用HTML和CSS创建了许多简单的网页,并了解所有基本概念(页面结构,级联性质等)

我第一次使用W3.CSS响应框架。

就像一个例子,我对默认链接样式不满意。我宁愿它是彩色的,也许是不同的字体重量,而不是下划线。

我可以想到两种可能发生的方式。我想知道在选择这些方式时会出现什么样的考虑因素。

(1)如果框架中存在链接样式类,我可以将它们添加到我的链接中。

(2)我附上自己的样式表。这是我第一次添加一个覆盖框架的样式表,那么我需要考虑什么才能确保我不会破坏框架其他部分的功能呢?

2 个答案:

答案 0 :(得分:1)

在自定义框架,W3.CSS,Bootstrap,Foundation或任何其他框架时,大多数开发人员将附加自己的样式表并覆盖他们想要修改的默认框架样式。

通常,这是要走的路,因为在更新框架时不会丢失自定义。

正如您所指出的,有时链接样式类可能是一个选项,如果它们是,那么使用它们是有意义的。你可能会发现造型类太有限了,不能让你做所有你需要的。

  

我需要考虑什么以确保我不会破坏功能   框架的其他部分?

只要您有一些CSS体验,您就可以清楚地了解哪些样式规则可以轻松更改以及您需要注意哪些样式规则。

祝你好运!

答案 1 :(得分:-1)

停在那里......除非你对HTML和CSS有充分的了解,否则不要使用框架。 - 特别是不要使用w3schools.com制作的东西。

https://developer.mozilla.org/en-US/docs/Web/HTML
https://developer.mozilla.org/en-US/docs/Web/CSS

<!doctype html><!-- declare the type of document (html) -->
<html>
  <head>
    <!-- document setup stuff -->
    <title>Example page</title>
    <link rel='stylesheet' type='text/css' href='framework-stylesheet.css' />
    <link rel='stylesheet' type='text/css' href='my-stylesheet.css' />

    <!-- you can put styles in the document... which I'll do for example - but you should most likely put them in an external file as linked to above -->
    <style>
      a {
        text-decoration: none;
        color: lightgreen;
      }

      a { /* your're additions and overrides... */
       color: 'im unique';
      }
    </style>
  </head>

  <body>
    <!-- content -->
    <a href='#'>example link</a>
  </body>
</html>