⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 flow-abs-rel-desc.html

📁 CSS lets learn this step by step...
💻 HTML
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html lang="en">  <head><meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">    <title>Long description for example illustrating positioningwith respect to a positioned ancestor</title>  </head>  <body>      <h1>Long description for example illustrating positioningwith respect to a positioned ancestor</H1><P>This diagram illustrates the effects of absolutely positioning abox ("inner") with respect to a containing block established by arelatively positioned ancestor ("outer").<P>A document window is shown, with 8 lines (numbered 1 to 8), each24px high. All body and "outer" text has been flowed into lines intolines 1, 2, and 3. The "inner" box has been positioned relative to thetop and left edges of the "outer" element's first inline box.<P>In the following PRE element, each 24 pixel line is simulated bytwo lines, the second beginning with the appropriate number.  Thereference edges for positioning the "inner" box are indicated in thediagram by thick dashed lines. The upper left coordinates of the"inner" box are labeled by (+200, -100). In the PRE element below,the reference edges for "inner" are indicated by vertical bars and equal signs. The offset of the "inner" box is given in square brackets.The lines of text, as they appear in theimage, contain approximately:</p><PRE>                        ====                             |1 Beginning of body contents.|Start2 of outer contents. End of outer3 contents. End of body contents.4          [(+200, -100)]5                Inner6                contents.7                8                </PRE><P>The default text color is black."Start of outer contents" is red."Inner contents" is blue."End of outer contents" is red.<P><a href="../../visuren.html#img-flow-abs-rel">Return to image.</a>  </body></html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -