카테고리 없음

[HTML] 현재 navbar 위치를 유지하면서 헤더 중앙에 배치

행복을전해요 2021. 2. 19. 11:57

첫째, 구문에 많은 문제가 있습니다. 예를 들어 <img>코드 내에서 코드 를 이동 해야 <body>합니다. 또한 <h1>코드 내부의 맨 아래에 있는 코드 도 이동해야합니다 <body>. 적절한 HTML 구문과 마크 업에 대한 자세한 내용은 Mozilla의 HTML 소개를 참조하십시오.

둘째, 많은 CSS 스타일링에 대해 외부 CSS 파일을 사용하는 것이 좋습니다 (다른 커뮤니티와 함께). 코드 개선을 시작 하려면JSFiddle참조하십시오 . CSS에 대한 훌륭하고 자세한 정보는 Mozilla의 CSS 개발자 가이드 를 참조하십시오.

다음 두 가지 이유로 "쇼핑" 텍스트가 중앙에서 벗어납니다.

하나 : 해결되지 않은 float항목이 CSS. CSS스타일 이 위에서 아래로 계단식으로 배열 됨을 의미합니다 . 순서가 중요합니다! 에서 요소 인 경우 다음 요소 아래에 있어야 합니다. 그렇지 않으면 그 이후의 모든 CSS 속성에 동일한 속성이 적용됩니다.CascadingStyle SheetsfloatCSSclearfloat

2 : 당신은 당신의 대한 폭 설정이없는 CSS문서가 가능성의 폭을 사용하려고, 그래서 속성을 <img>당신에 태그를 HTML,하는 것입니다 719px. 이것은 width: 719px;기본적으로를 중심으로 "Shop"텍스트를 만드는 것 입니다. 위의 JSFiddle 링크에 이러한 수정 사항을 추가했지만 중복성을 위해 코드를 대체해야하는 CSS 코드는 다음 <h1>과 같습니다.

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/22079894