Question

我如何将一个h1置于div中心。这是我项目的图片，我希望以“悬浮效果”为中心，以头部为中心，位于绿线的正下方。

'/tmp/imagenet'

Answer 1

＆＃13;

<!DOCTYPE html>
<html>
<head>
	<link href="https://fonts.googleapis.com/css?family=Titillium+Web" rel="stylesheet">
	<link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="css/main.css">
	<title>My Portfolio</title>
</head>
<body>

	<div id="header">
		<header>Mr. Philip Braun</header>
		<img src="img/greeny.png">
		<h1 class="hvr-float-shadow" style="text-align:center">About  Me</h1>
		<br>
		<p> I'm a funny and classy guy from London<br>and i dare you to click "About Me"<br>because if you don't, you are missing your chance of knowing about a guy<br>who works hard for what he is made and of course doing it<br> <b>perfectly<b><br> <b>with finesse</b> </p>
	</div>

		<br><br>

	<img class="braun" src="img/braun3.jpg">

</body>
</html>

＆＃13;

使用CSS，您可以应用text-align属性将元素设置为通过我提供的代码段中的内联方法居中，或者通过引用类或元素的内部或外部样式设置。

h1{
    text-align:center;
}

Answer 2

<!DOCTYPE html>
<html>
<head>
    <link href="https://fonts.googleapis.com/css?family=Titillium+Web" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <title>My Portfolio</title>
</head>
<body>

    <div id="header">
        <header>Mr. Philip Braun</header>
        <img src="img/greeny.png">
        <center>
                <h1 class="hvr-float-shadow">About  Me</h1>
            </center>
        <br>
        <p> I'm a funny and classy guy from London<br>and i dare you to click "About Me"<br>because if you don't, you are missing your chance of knowing about a guy<br>who works hard for what he is made and of course doing it<br> <b>perfectly<b><br> <b>with finesse</b> </p>
    </div>

        <br><br>

    <img class="braun" src="img/braun3.jpg">

</body>
</html>

这是将文本居中的最简单方法。

如何在div中居h1

2 个答案: