gpt4 book ai didi

html - 如何让我的导航栏
  • 元素 CSS 居中?
  • 转载 作者:行者123 更新时间:2023-11-28 17:51:34 26 4
    gpt4 key购买 nike

    我希望我的导航栏在屏幕上 100% 移动,但 LIST 元素都留在左边而不是居中,我确信它很简单,但我已经做了几个小时的 HTML 和 CSS,我的大脑不再工作了:( 请帮忙?

    .solidblocktheme{ /*additional mega drop down menu style for this theme*/
    border:5px solid #cd0000;
    padding:0; /*remove default padding inside mega menu*/
    }

    .solidblocktheme p, .solidblocktheme .column{
    padding:5px; /*add padding inside p and .column elements within mega menu*/
    width:auto;
    }

    .solidblockmenu{
    width: 100%;
    margin: 0 auto;
    padding: 0;
    float: left;
    font: bold 15px Arial;
    overflow: hidden;
    margin-bottom: 1em;
    border: 1px solid #625e00;
    border-width: 1px 0;
    background: black url(Images/blockdefault.gif) center center repeat-x;
    }

    .solidblockmenu li{
    display: inline;
    margin: 0 auto;
    }

    .solidblockmenu li a{
    float: left;
    color: white;
    padding: 9px 11px;
    text-decoration: none;
    border-right: 1px solid white;
    }

    .solidblockmenu li a:visited{
    color: white;
    }

    .solidblockmenu li a:hover, .solidblockmenu li a.selected{ /*Selected Tab style*/
    color: white;
    background: transparent url(Images/blockactive.gif) center center repeat-x;
    }


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>New Website Layout</title>
    <link rel="stylesheet" type="text/css" href="cssLayout.css">

    <link rel="stylesheet" type="text/css" href="ddmegamenu.css" />

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>

    <script src="ddmegamenu.js">

    /***********************************************
    * DD Mega Menu (c) Dynamic Drive (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for this script and 100s more.
    ***********************************************/

    </script>

    <script>

    ddmegamenu.docinit({
    menuid:'solidmenu',
    dur:1000 //<--no comma after last setting
    })


    ddmegamenu.docinit({
    menuid:'megaanchorlink',
    dur:500,
    easing:'easeInOutCirc' //<--no comma after last setting
    })

    </script>
    </head>

    <body>



    <ul id="solidmenu" class="solidblockmenu">
    <li><a href="">Home</a></li>
    <li><a href="">About Us</a></li>
    <li><a href="">Images</a></li>
    <li><a href="" rel="jkmenu">Events v</a></li>
    <li><a href="">Contact Us</a></li>
    </ul>

    <!--First mega menu (1) -->

    <div id="jkmenu" class="mega solidblocktheme">

    <p style="margin:5px 0 10px 0"><b>Choose from our clubs events!</b></p>

    <div class="column">
    <ul>
    <li><a href="">Snooker</a></li>
    <li><a href="">Darts</a></li>
    <li><a href="">Poker</a></li>
    <li><a href="">Quiz</a></li>
    <li><a href="">Cabaret</a></li>
    </ul>
    </div>

    </div>



    </body>
    </html>

    最佳答案

    试试这个:

    .solidblockmenu {
    width: 100%;
    padding: 0;
    font: bold 15px Arial;
    overflow: hidden;
    margin-bottom: 1em;
    border: 1px solid #625e00;
    border-width: 1px 0;
    background: black url(Images/blockdefault.gif) center center repeat-x;
    text-align: center;
    }

    .solidblockmenu li {
    display: inline-block;
    margin: 0 auto;
    }

    .solidblockmenu li a {
    color: white;
    padding: 9px 11px;
    text-decoration: none;
    border-right: 1px solid white;
    }

    关于html - 如何让我的导航栏 <LI> 元素 CSS 居中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22226750/

    26 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com