집 > 기사 > 웹 프론트엔드 > CSS에서 부동 중심을 설정하는 방법은 무엇입니까?

CSS에서 부동 중심을 설정하는 방법은 무엇입니까?

不言원래의: 2018-10-30 14:05:2326199검색

CSS의 float 속성에서 float:right는 오른쪽에 부동하고 float:left는 왼쪽에 부동하지만 centered 속성이 설정되지 않았습니다. 그렇다면 float 속성을 중앙에 배치하려면 어떻게 해야 할까요? 이 글에서는 CSS에서 float 속성을 중앙에 배치하는 방법을 소개합니다.

내비게이션 바를 만들 때 플로팅 센터링을 자주 사용합니다. 아래에서는 네비게이션 바의 플로팅 센터링을 사용하여 CSS의 플로트 센터링 방법을 소개합니다. (관련 권장사항: css의 float 속성을 사용하는 방법

Css에서 float를 가운데에 배치하는 방법: 사용 display: inline-block 및 float:left

특정 부동소수점 센터링 예제 코드를 살펴보겠습니다.

#🎜🎜 #

<!DOCTYPE html>
 <html>
    <head>
        <meta charset=utf-8" />
        <title></title>
        <style type="text/css">
            * {
             margin:0; 
             padding:0; 
             list-style:none;
         }
            body {
             text-align:center;
         }
            li {
             float:left; 
             font-size:12px;
         }
            a {
             float:left; 
             border:1px solid #000; 
             padding:5px 10px; 
             text-decoration:none; 
             color:#000;
         }
            ul {
             display:inline-block; 
             *display:inline; 
             zoom:1;
         }
        </style>
    </head>
    <body>
        <ul>
            <li><a href="#nogo">首页</a></li>
            <li><a href="#nogo">视频</a></li>
            <li><a href="#nogo">文章</a></li>
            <li><a href="#nogo">登录</a></li>
            <li><a href="#nogo">留言</a></li>
        </ul>
    </body>
 </html>

#🎜🎜 #float 부동 센터링 효과는 다음과 같습니다:

CSS에서 부동 중심을 설정하는 방법은 무엇입니까?

위 코드와 관련하여 *디스플레이가 표시됩니다. inline;은 실제로 일종의 CSS 핵 작성 방법입니다. (CSS 핵 작성 방법을 모르면 Baidu에서 직접 검색할 수 있습니다.) *{margin: 0;padding: 0;}이 일반적입니다. 웹 페이지의 모든 요소를 긴밀하게 고수하는 과거의 "재설정" 스타일은 서로 다른 브라우저가 서로 다른 기본 요소 스타일을 생성하므로 *{ margin: 0;}의 주요 목적은 다음과 같습니다. 다양한 브라우저 표시를 달성하기 위해 다양한 브라우저 기본 스타일을 재설정하는 데 도움이 됩니다. 웹 페이지의 결과는 크게 다르지 않습니다.

위의 방법을 읽어보고 나면 CSS 핵을 사용해 작성할 생각이 안 날 수도 있고, 호환성도 좋지 않은 경우도 있으니,

그래서 *를 사용하지 않는지 살펴보겠습니다. 디스플레이:인라인 의 구현 방법은 다음과 같습니다.

위 내용은 CSS에서 부동 중심을 설정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

css Float display margin padding

성명：

이전 기사：CSS의 float 속성을 사용하는 방법은 무엇입니까? CSS 부동 속성 float에 대한 자세한 설명다음 기사：CSS의 float 속성을 사용하는 방법은 무엇입니까? CSS 부동 속성 float에 대한 자세한 설명