网站标题问题

Question

Fiddle: http://jsfiddle.net/Slayerk96/384vy/ 小提琴： http : //jsfiddle.net/Slayerk96/384vy/

My header is very wacky and unprofessional. 我的标头很古怪而且不专业。 I've been playing around with this header and I can't seem to get it right. 我一直在玩这个标头，但似乎无法正确处理。 Current header: (notice line between home and my name) 当前标题：（通知首页和我的名字之间的一行）

Name(underlined) Home_blog_contact

I have tried to position these items using css but the css won't adjust it right. 我试图使用CSS定位这些项目，但CSS不会正确调整它。

What I'm trying to make it look like: 我正在尝试使其看起来像：

Name(bold and big no underline) Home Blog Contact(on same line)

current css 当前的CSS

.nav {
  background-color: #000000;
  color: #CCCCCC;
  font-style: italic;
  font-size: 30px;
  border-color: 000000;
  position: absolute;
  top: 0px;
  right: 0px;
  left: 0px;
}

.Menu
{
 display: inline-block;
    float: right;
    text-decoration: none;
    width: 40%;
}
.Menu li{
  display: inline;
  background-color: #000000;
}

.Menu li a{
  color: #CCCCCC;
  font-style: italic;
  font-size: 20px;
  text-decoration: none;
}

.Name {
  float: left;
}

.Menu li a:hover {
  color: #FFFFFF;
}

current html: 当前HTML：

<!DOCTYPE html>
<html>
  <head>
    <Title>Name</Title>
    <link rel="stylesheet" href="My Site Template.css">
    <script src="Page on googleapis.com"></script>
    <script src="styling my site.js"></script>
  </head>
  <body>
   <div class='nav'>
 <ul class='Menu'>
        <li><a href='#'><span>Home</span></li>
        <li><a href='#'><span>Blog</span></li>
        <li><a href='#'><span>Contact</span></li>
      </ul>     
 <h1 class='Name'>Name</h1>
    </div>

Answer 1

As Roko C. Buljan correctly noted, you forgot to close your anchor tags: 正如Roko C. Buljan正确指出的那样，您忘记了关闭锚标签：

http://jsfiddle.net/LimitedWard/9xh5L/ http://jsfiddle.net/LimitedWard/9xh5L/

<div class='nav'>
    <ul class='Menu'>
        <li><a href='#'><span>Home</span></a></li>
        <li><a href='#'><span>Blog</span></a></li>
        <li><a href='#'><span>Contact</span></a></li>
    </ul>     
    <h1 class='Name'>Name</h1>
</div>

A good text editor (like Sublime Text) helps solve this problem by using syntax highlighting and autocompletion. 好的文本编辑器（例如Sublime Text）可以通过使用语法突出显示和自动完成功能来解决此问题。

EDIT: you can also add padding-top to your .menu to make it align better vertically with .Name. 编辑：您还可以在.menu中添加padding-top ，以使其与.Name垂直对齐。

网站标题问题

问题描述

1 个解决方案

解决方案1
0 已采纳 2014-08-04 18:46:26

网站标题问题

问题描述

1 个解决方案

解决方案1 0 已采纳 2014-08-04 18:46:26

解决方案1
0 已采纳 2014-08-04 18:46:26