【问题标题】:How to style logo of my website in right way? [duplicate]如何以正确的方式设计我网站的标志? [复制]
【发布时间】:2014-05-18 05:42:52
【问题描述】:

我已将网站徽标创建为文本,但徽标的第一部分“hello”需要其他样式,而不是第二部分“Kitty”

要求:

  • 这两个词都必须是斜体,所以我创建了一个 h1 类“logo-text”DONE
  • 第二个单词“Kitty”需要加粗,NOT DONE

    <h1 class="logo-text">
    
      <a href="<?php echo home_url(); ?>" title="<?php bloginfo( 'name' ); ?>" rel="home">hello
    
         <span class="logo-text-kitty>"Kitty</span>
      </a>
    </h1>
    

让“Kitty”加粗的正确方法是什么?使用跨度?

【问题讨论】:

  • 整个 php 内容是否与您的问题相关?
  • @Jongware 几年前,我们将&lt;center&gt;&lt;font&gt; 之类的表示性标记留在了尘埃中。 HTML 应该描述内容,而不是外观。 strong 默认情况下使某些内容变为粗体这一事实并不足以在您想要粗体文本时使用它。这很挑剔,但我相信这是问题的本质。
  • css对我来说并不重要,它只是关于html语义

标签: html css


【解决方案1】:
<style>
.bold-class{
font-weight: bold;
}
</style>
<h1 class="logo-text"><a href="<?php echo home_url(); ?>" title="<?php bloginfo( 'name' );?>" rel="home"><span class="bold-class">helloKitty</span></a></h1>

【讨论】:

  • 我不喜欢这个答案的一切。你不需要调用一个类“-class”,因为我们已经知道它是一个类。您不需要将事物命名为“粗体”,因为这并不是真正描述数据(这就是在以后的 html 标准中重新定义了 定义为“粗体”的全部原因),并且您将继续使用 当一个 更有意义时。
  • 哦,正如我在其他答案中指出的那样, 可能比 更好。不是最重要的一点,因为 是这个答案中最少的冒犯。
【解决方案2】:

你可以通过给每个单词一个类来单独设置它的样式

HTML

<h1 class="logo-text">
    <a href="<?php echo home_url(); ?>" title="<?php bloginfo( 'name' ); ?>" rel="home">
        <span class="logo-first-word">hello</span>
        <span class="logo-second-word">Kitty</span>
    </a>
</h1>

CSS

.logo-first-word{
    //some CSS code
}

.logo-second-word{
    font-weight:bold;
    //some CSS code
}

【讨论】:

  • 感谢您的帮助,但 Flamur 快了 4 分钟,所以 :)
  • @Engin 不客气
  • 像您的第一个答案这样的内联样式是非常糟糕的形式。 HTML 描述您的内容,而 CSS 描述样式。样式元素偶尔会用到,通常是渲染的内容(例如,包括来自 PHP 的背景图像),但在这种情况下,您直接在 html 和 css 中拆分相同的样式。但是,您的第二种方法是合理的。
  • @JoshfromQaribou 感谢您提供的信息
【解决方案3】:

使用最能描述内容的标签。在这种情况下,&lt;strong&gt;。或者,如果 'kitty' 并不比 'hello' 更重要,&lt;b&gt; 将是一个更好的选择,简单意味着格式不同。

【讨论】:

  • 但是不代表“粗体”对吧???那么我是否必须将强者设置为粗体......?
  • 我更喜欢 &lt;b&gt; 而不是 &lt;strong&gt; 在徽标中。 &lt;strong&gt; 表示非常强调,在这里可能不合适。
  • @Engin 您不必设置&lt;strong&gt; 的样式以使其显示为粗体,这是默认样式。
  • 除非特别重新设置样式,&lt;strong&gt; 显示为粗体文本。 &lt;b&gt; 也是如此。
  • strong 是为了强调。使用b(也许)或span(安全赌注)。
猜你喜欢
  • 1970-01-01
  • 2019-08-02
  • 1970-01-01
  • 1970-01-01
  • 2017-08-08
  • 2016-06-07
  • 1970-01-01
  • 2021-12-22
  • 1970-01-01
相关资源
最近更新 更多