Question

我如何在我的边框的右上方放置一个像Image这样的小徽标，以便它适合并且不会调整边框大小？

我的代码：

<html>
<head>
body {
text-align: center;
background-color: white;
margin: 0;
padding: 0;}
h1 {
font-family: 'Fjalla One', sans-serif;
color: #000;}
p {
font-family: 'Roboto', sans-serif;
font-size: 14px;}
<style>
#logo {
border-style: solid
border-color: #000;
border-width: 100%;}
</style>
</head>
<body>
<div id="logo">
<h1>example.com</h1>
<p>Examples examples examples.</p>
</div>
</body>

Answer 1

很难说出你想要实现的目标，因为你的代码有问题而且你没有展示你想要如何放置这个图像。

一种可能的解决方案是：例如：

<html>
<head>
<style>
body {
text-align: center;
background-color: white;
margin: 0;
padding: 0;}
h1 {
font-family: 'Fjalla One', sans-serif;
color: #000;}
p {
font-family: 'Roboto', sans-serif;
font-size: 14px;}

#logo {
border-style: solid;
border-color: #000;
border-width: 100%;
background: url('WdP7OUV.jpg') top right no-repeat;
}
</style>
</head>
<body>
<div id="logo">
<h1>example.com</h1>
<p>Examples examples examples.</p>
</div>
</body>

如果图像太大，我强烈建议您使用任何软件调整大小。但是，您也可以在以下方式添加其他方式：

background: url('WdP7OUV.jpg') top right no-repeat;

线

background-size:80px 80px;

但在这种情况下，你不必要加载太大的图像，这是浪费转移，所以最好在图形软件中进行扩展。

如何将图像放在右上角？

1 个答案: