ID 为 CSS 和 HTML - Select 的按钮

Question

我正在尝试创建我的第一个网站，但一直停留在菜单按钮（导航栏）上。我终于设法以某种方式创建了一个按钮。通过 ID、class 和属性观看了一些关于 CSS 选择器的视频，但是每当我尝试修改第一个按钮的工作代码以应用于其余按钮时，它就是行不通.. 我正在尝试使用 ID 而不是 Class 选择（class 工作得很好）因为我想更改每个按钮的图片和大小并让所有按钮都在同一行上，我自己也做不到。

这是我的带有 Class 选择器的代码，请告知如何使用 ID 来制作它，就像我只是用散列标签更改点一样，它不起作用。如果我 尝试重新排序 选定的部分，如 a、li 等，它不起作用

JSFiddle example

#menu {
    height: 70px; /* separating the next content from the button */
    width: 0px;
    text-align: center;
    margin: 0, auto;
}

我该怎么做以及如何使菜单在同一行上。尝试使用 float 和 style="clear:both" 之后菜单后面的内容，但似乎不起作用。

Answer 1

首先，您不应该对 select 那种项目使用 ID。更好地使用 ID 来识别您网站的区域。

但是，您可以在此处找到有效代码：http://jsfiddle.net/cjTN7/24/

#home, #about, #news { background-size: cover; }
#home { 
    height: 100px;
    width: 100px; 
}
#about {
    height: 200px;
    width: 200px; 
}
#news {
    height: 300px;
    width: 300px; 
}

对于内联菜单，您将#menu 宽度设置为 0 像素。 #menu 应该是 100%（或者比你里面的项目大的任何东西）并且将你的项目设置为 inline-block 而不是 block。

不知道我是否理解你的问题，但希望对你有所帮助。祝你好运:)

ID 为 CSS 和 HTML - Select 的按钮

Buttons with CSS and HTML - Select by ID

html

css

menu

button

css-selectors