Question

我所指的元素是这里的页脚链接：http://individual.utoronto.ca/andrewlouis

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Andrew Louis' Portfolio</title>
    <link rel="stylesheet" href="fonts/stylesheet.css" type="text/css" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="javascript/jqueryscript.js"></script>

<body>

    <h2>Andrew Louis</h2>

    <div class="centered">
        Coming Soon.
        <div id = "subheading">
            <a href="http://andrewlouis.posterous.com">Click here to go to my blog in the meantime.</a>
        </div>
    </div>




</body>
</head>
</html>

相关CSS：

#footer {position:relative;}

#heading{
    font-family:'Lobster1.3Regular';
    color:#D04D21;
    position: absolute;
    font-size:80px;
    top: 10%;
    left: 0px;
    width: 100%;
    height: 1px;
    text-align:center;
    text-shadow: 0 0 2px rgba(0,0,0,0.9);
}

.nav_wrapper{
    min-height: 50px;
    width: 100%;
    position: absolute;
     bottom:-500px; ; left:0px;
}

#list_orientation li a {
    text-decoration:none;
    text-align:center;
    color:black;

}
#list_orientation li{
    display:inline-block;
    padding:50px;
    height:50px;width:50px;
    text-align:center;
    width:20%;

Answer 1

它们似乎是换行符，因为它们比页面换行更宽。您可以使用媒体查询为元素提供更小的宽度和高度值吗？

我的粘性页脚在更大或更小的屏幕上显示奇怪，我如何使这些元素按比例缩放？

1 个答案: