大家好,我目前正在尝试制作一个网站,我已经绘制了设计,并开始尝试使用几个 div 标签、 Logo 图像、底部边框和按钮来制作标题。 这是我尝试做的事情的基本概述:(抱歉,它模糊但可用)
最后这是负责的代码,有人能看到我搞砸的地方吗?该行应该覆盖从 Logo 到右侧的大部分页面,因此它必须是 div 容器
<html>
<head>
<style>
body{ background-image: url("wood texture.jpg");
}
.header{
position:relative;
width:100%;
height:10%;
<!--border-style:solid;
border-color:black;
border-width:0px 0px 10px 0px;-->
}
.headlogo{
width:25%;
height:100%;
position: absolute;
padding 0;
margin:0;
}
.headline{
width:100%;
height:100%;
margin:0px 0px 0px 60%;
<!--padding:0px 0px 0px 25%;
position: relative;
left:25%;
top:0px;-->
float: right;
border-style:solid;
border-color:black;
border-width:0px 0px 10px 0px;
}
</style>
</head>
<body>
<div id="" class="header">
<div id="" class="headlogo">
<img src="logo.png" alt="" style="width:25%; height:50%; margin-right:10px; float:right;"
</div>
<div id="" class="headline">
Buttons will go in here and look supper cool but first this needs to stretch all the way to the right from about where the logo stops
</div>
</div>
</body>
</html>
最佳答案
您只是在 css 中使用了错误的行注释。
HTML 为 <!-- something here -->
CSS 是 /* something here */
正如评论中所指出的,您没有使用 />
关闭图像
参见 fiddle :https://jsfiddle.net/DIRTY_SMITH/7oe5kh9L/50/
既然你在评论中问了,我就在这里添加 .html
中的 CSS 行注释使用 notepad++ 时,文件似乎不会被注释掉,要测试它,请尝试使用 .css
中的 css 行注释。使用notepad++创建文件,你会发现它确实有效。我创建这个 fiddle 是为了向您展示 /* */
实际上是在 <style>
内的正确行注释标签。 https://jsfiddle.net/DIRTY_SMITH/7oe5kh9L/52/
毕竟,如果还有问题,您可以观看这个小剪辑:http://docs.emmet.io/actions/toggle-comment/
body{ background-image: url("wood texture.jpg");
}
.header{
position:relative;
width:100%;
height:10%;
/*border-style:solid;
border-color:black;
border-width:0px 0px 10px 0px;*/
}
.headlogo{
width:25%;
height:100%;
position: absolute;
padding 0;
margin:0;
}
.headline{
width:100%;
height:100%;
margin:0px 0px 0px 60%;
/*padding:0px 0px 0px 25%;
position: relative;
left:25%;
top:0px;*/
float: right;
border-style:solid;
border-color:black;
border-width:0px 0px 10px 0px;
}
关于html - Div 标签和标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36163267/