Question

大家好我当前正在努力创建一个我已经绘制出设计的网站，并且已经开始尝试使用几个div标签，徽标图像，底部边框和按钮来制作标题。下面是我尝试todo的基本概述:(抱歉它模糊但可用）

这是当前的结果，看起来很糟糕。

Finnaly这里的代码是负责任的人可以看到我搞砸了吗？该行应覆盖从徽标到右侧的大部分页面，因此它必须是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>

Answer 1

你刚刚为你的css使用了错误的行注释。

HTML为

CSS是/* something here */

如同评论中所述，您没有使用/>

关闭图片

请参阅小提琴：https://jsfiddle.net/DIRTY_SMITH/7oe5kh9L/50/

因为您在评论中提到了我将在此处添加 .html文件中的Css行注释在使用notepad ++时似乎不会被注释掉，以测试它尝试使用使用notepad ++在.css文件中对css行注释，你会发现它确实有效。我创建了这个小提琴，告诉你/* */标签内部<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;
        }

Div标签和标题

1 个答案: