Home > Web Front-end > HTML Tutorial > All assets 70 points help div css problem_html/css_WEB-ITnose

All assets 70 points help div css problem_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:17:00
Original
1119 people have browsed it

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="top.aspx.cs" Inherits="top" %><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><script type="text/jscript" src="jsinc/MdiWin.js"></script><title>top</title>    <style type="text/css">        .all {            left :0px;            top: 0px;            height: 66px;            width: 100%;            }                 #imglogo        {              left :0px;            top: 0px;            height: 66px;            width: 213px;        }           </style></head><form id="top" runat="server"><body><div  class="all" >   <div id="imglogo"><img alt="logo" src="images/logo.jpg" /></div></div></body></form></html>
Copy after login

The display effect is like this

Now there is a div
with the content:
    <div>    <a href="#" target="_blank"  >反馈建议</a> |    <a href="">帮助中心</a> |    <a href="#" >退出</a></div>
Copy after login

I want it to appear in class=" "all" in the upper right corner of the div, and no matter how the window changes, this div will always be in the upper right corner. How should I write this?
The effect you want to achieve is like this


Reply to the discussion (solution)

.all {position:fixed}

If it is to appear In the upper right corner of the all div, use absolute positioning. Define the all div as relative or absolute, then set the upper right div to absolute, and then set the top and right values. I don’t know if this is what you want

You don’t need to specify the address. What I want is that no matter how the window changes, the div should always be in the upper right corner

. The original poster specified that left and top are the same. This place is only used for positioning. So if you use absolute positioning, use position: to set it. If you don’t want to use absolute positioning, use float to float. There is no need to set left top

The complete code is as follows:



Untitled Document< ;/title> <br /> <style> <br /> .imglogo <br /> { <br /> width:100%;<!--The percentage positioning will automatically adjust with the window size. If you want to fix the display, you can The width here is fixed at 950px~1000px--> <br /> margin:2px auto; <br /> } <br /> .topInfo <br /> { <br /> width:100%;<!--The percentage positioning will change accordingly The window size is automatically adjusted. If you want to fix the display, you can fix the width here to 950px~1000px--> <br /> margin:0px auto; <br /> } <br /> img <br /> { <br /> border: 1px solid #ccc; <br /> } <br /> body <br /> { <br /> font:"宋体" 15px; <br /> color:red; <br /> } <br /> A:link { <br /> COLOR: red; TEXT-DECORATION: none <br /> } <br /> A:visited { <br /> COLOR: red; TEXT-DECORATION: none <br /> } <br /> A:hover { <br /> COLOR: red; TEXT- DECORATION: none <br /> } <br /> </style> <br /> <script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script> </head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div> <br /> <br /> <body> <br /> <div class="topInfo" align="right"> ; <br /> <a href="#">Feedback & Suggestions</a> | <a href="#">Help Center</a> | <a href="#"> Exit</a> <br /> </div> <br /> <div class="imglogo" align="left"><!--If there is other content on the right side of the logo, you can Add a table to the div--> <br /> <img src="images/logo_1.jpg" title="logo" /> <br /> </div> <br /> </body> <br /> </html> <br /> <br /> Remember to add points~~~~ </p> <p class="sougouAnswer"> The complete code is as follows: <br /> <html xmlns="http://www.w3.org/ 1999/xhtml"> <br /> <head> <br /> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <br /> <title>None Title document