First, there are a lot of problems with your syntax. For example, you need to move your <img> code inside your <body> code. You also need to move the <h1> code at the bottom inside your <body> code as well. Take a look at Mozilla's Introduction to HTML to learn more about proper HTML syntax and markup.
Second, I would recommend (along with the rest of the community, most likely) that, for so much CSS styling, you use an external CSS file. See this JSFiddle for a start on improving your code. Visit Mozilla's CSS developer guide for some great and detailed information about CSS.
Your "Shop" text is off-center for two reasons:
One: Because you have some unresolved float entries further up the CSS. CSS stands for CascadingStyle Sheets, which means that the styles cascade from top to bottom; order is important! If you float an element anywhere in your CSS, you need to clear it in the next element down. Otherwise, all CSS properties from there onward will have the same float property applied to them.
Two: You don't have a width set for any of your CSS properties, so the document is likely trying to use the width of the <img> tag in your HTML, which is 719px. This is making the "Shop" text centered on width: 719px;, basically. I've added these fixes in the JSFiddle link above, but for redundancy's sake, here is the CSS code that you should replace your <h1> code with:
h1 {
clear: both;
width: 100%;
color: #FFFFFF;
text-align:center;
background-color:#00a651;
}
이것은 당신을 도울 것입니다 : http://jsfiddle.net/L2nZQ/5/
그러나 당신은 정말로 기초를 배우기 시작해야합니다.
<html>
<head>
<title>Your Title</title>
<style>Your CSS</style>
</head>
<body>
Your Code
</body>
</html>
http://www.w3schools.com/ 을 수행하기에 좋은 사이트입니다 .
http://validator.w3.org/에서 코드를 확인할 수 있습니다.
출처
https://stackoverflow.com/questions/22079799