如何从DIV的顶部和底部删除额外的空间

我正在使用自动生长div显示代码。它在代码上方显示一条空间和代码下方的空间线。我想删除它。我尽力了，但失败了。你能帮上它吗？感谢您的全部支持。这是它看起来的图像 - 输出的图像

这是我的代码

.code{
    background-color: #d1e0e0;
    font-family: 'Microsoft New Tai Lue', sans-serif;
    font-size: 15px;
    overflow: hidden;
    height: auto;
    width: 100%;
}

<html>
    <head>
        <title>HTML Tutorial</title>
        
    </head>
    <body>
        <div class="code" id="text">
            <xmp>
                        <!DOCTYPE html>
                        <html>
                            <head>
                                <title>HTML Tutorial</title>
                            </head>
                            <body>
                                This is a simple HTML page
                            </body>
                        </html>
            </xmp>            
        </div>
    </body>
</html>

您可以调整html中的间距。

.code{
background-color: #d1e0e0;
font-family: 'Microsoft New Tai Lue', sans-serif;
font-size: 15px;
overflow: hidden;
height: auto;
width: 100%;
}

<div class="code" id="text">
        <xmp>                        <!DOCTYPE html>
                    <html>
                        <head>
                            <title>HTML Tutorial</title>
                        </head>
                        <body>
                            This is a simple HTML page
                        </body>
                    </html></xmp>            
    </div>

给出边缘和填充0px

element { margin: 0px; padding: 0px; }

如果可以的话，请使用它。希望它对您有帮助。谢谢。

.code{
    background-color: #d1e0e0;
    font-family: 'Microsoft New Tai Lue', sans-serif;
    font-size: 15px;
    overflow: hidden;
    height: auto;
    width: 100%;
}
xmp {
    margin: 0px;
    line-height: 1;}

<html>
    <head>
        <title>HTML Tutorial</title>
        
    </head>
    <body>
        <div class="code" id="text">
            <xmp>
                        <!DOCTYPE html>
                        <html>
                            <head>
                                <title>HTML Tutorial</title>
                            </head>
                            <body>
                                This is a simple HTML page
                            </body>
                        </html>
            </xmp>            
        </div>
    </body>
</html>

或者您可以使用

之类的海洋缘

xmp{margin:-15px;}

xmp {
    margin-top: -15px;
    margin-bottom: -15px;
}

相关内容

最新更新

热门标签：