问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

CSS 定位问题：无效的属性值

社区维基
1
新手上路，请多包涵

我有一些非常简单的 HTML/CSS 代码，无论我做什么，我总是会收到 chrome 的“无效属性值”异常，并且徽标无法正确定位。

修复了第一个问题，但现在图像不移动与边框相关。

 <html lang="de" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>my website</title>
    <style type="text/css">

        *{ padding: 0; margin: 0; }

        .header {
            width: 100%;
            height: 100px;
            border: none;
            border-bottom-style: solid;
            border-bottom-width: 5px;
            position: relative;
            border-bottom-color: rgb(220,30,60);
        }

        .logo {
            position: absolute;
            padding-bottom:50px;
            height: 150%;
            width: auto;
        }

    </style>
</head>

<body>
    <div class="header" id="header">
        <img id="logo" class="logo"  src="image.png"/>
    </div>
</body>
</html>

原文由 tagduck 发布，翻译遵循 CC BY-SA 4.0 许可协议

Stack Overflow 翻译htmlcsspositionpadding
阅读 864
2 个回答
得票最新
社区维基
1
✓ 已被采纳

我只是不明白为什么在这种情况下你使用 padding-bottom 而不是 bottom 。反正：

    <html lang="de" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title>my website</title>
        <style type="text/css">
             *{ padding: 0; margin: 0; }
            .header {
                position: relative;
                height: 100px;
                border-bottom: 5px solid rgb(220,30,60);
            }
            .logo {
                position: absolute;
                bottom:50px;
                height: 150%;
                width: auto;
            }
        </style>
    </head>
    <body>
     <div class="header" id="header">
        <img id="logo" class="logo"  src="image.png"/>
     </div>
    </body>
    </html>

CSS 底部 属性： http ://www.w3schools.com/cssref/pr_pos_bottom.asp

CSS padding-bottom 属性： http ://www.w3schools.com/cssref/pr_padding-bottom.asp

原文由 Vixed 发布，翻译遵循 CC BY-SA 4.0 许可协议

社区维基
1

我有一个类似的问题。

我写了 10 （而不是 10px ），这解决了这个问题。

原文由 Manohar Reddy Poreddy 发布，翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录，登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进，让解决方法与时俱进
推荐问题
logo
Stack Overflow 翻译
子站问答
访问
宣传栏