html - 我应该为我的网站使用什么位置[需要建议]

标签 html css

所以我目前正在我的网站上工作......我在尝试向页面添加图像时遇到了问题。所以我通过添加这个开始了主页-

#titleOne, #paraOne, #paraTwo, #paraThree{
	text-align: center;
}
<!DOCTYPE html>
	<html>
		<head>
			<link rel="stylesheet" type="text/css" href="style.css">
		</head>
	<body>	
        <center>
		<h1 id="titleOne">Hello!</h1>
		<p id="paraOne">This is my first website!</p>

		<hr>

		<p id="paraTwo">Hopefully this isn't too boring :/ stay and you might like what you see in the future!</p>
		<p id="paraThree">Fact: I will not stop until I get it done.</p>

    </center>
	</body>
	</html>

效果很好,一切都在中心,看起来很棒!但是现在,当我尝试添加图像并将其放在中心标签中时,它会添加到中心。我不想要那个...我希望图像进入屏幕的右上角,但有几个百分比的间隙,这样它就不会卡在屏幕的一侧。我似乎无法做到这一点,因为要做到这一点,我必须做出 position: absolute;当我这样做时,一切都变得不合时宜。你们会推荐什么?这是图片代码。

#img {
    /*position: absolute;*/
	width: 100px;
	height: 100px;
	border-radius: 100%;
	-webkit-animation: fadein 2s; 
}

@keyframes fadein {
	from { opacity: 0; }
	to { opacity: 1; }
}
<img id="img" src="imgs/meFive.JPG" alt="My picture" >

谢谢!

最佳答案

你不应该把图片放在中心标签中。你应该放在中心标签外面

img {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    -webkit-animation: fadein 2s; 
    position: absolute;
    top: 0px;
    right: 0px;
}

关于html - 我应该为我的网站使用什么位置[需要建议],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41868704/

相关文章:

php - 在 PHP 中使用 div 标签动态创建网格布局

html - 可滚动表格内容 html/css

javascript - 动态 jqGrid 的水平滚动条问题

jquery - 如何使用 JQuery 将按钮移动到左侧?

html - 如何将图像移动到 html/css 中的下一行

html - 如何创建一个元素向右浮动而另一个元素向左浮动的行

javascript - 如何使用 jQuery CSS 方法传递媒体查询

javascript - 通过ckeditor添加的表不保留style属性

html - 菜单的样式下拉部分

jquery - 仅填充背景颜色总宽度的 50%