實(shí)例解析CSS DIV絕對(duì)定位與固定定位用法
CSS DIV網(wǎng)頁(yè)布局有很多值得學(xué)習(xí)的地方,而定位是非常重要的知識(shí),本文和大家通過實(shí)例向大家描述一下CSS DIV絕對(duì)定位與CSS DIV固定定位的應(yīng)用,希望對(duì)你的學(xué)習(xí)有所幫助。
CSS DIV中絕對(duì)定位與固定定位實(shí)例
CSS DIV中絕對(duì)定位與固定定位內(nèi)容是非常重要的,如果你掌握不好DIV的定位你的CSS寫出來(lái)會(huì)很亂,下面我們要來(lái)看看CSS DIV絕對(duì)定位與固定定位實(shí)例,這個(gè)我想對(duì)你會(huì)有幫助的。
第一個(gè)CSS DIV固定定位實(shí)例
- <styletypestyletype="text/css">
- p.one
- {
- position:fixed;
- left:5px;
- top:5px;
- }
- p.two
- {
- position:fixed;
- top:30px;
- right:5px;
- }
- </style>
- </head>
- <body>
- <pclasspclass="one">一些文本。</p>
- <pclasspclass="two">更多的文本。</p>
第二CSS DIV絕對(duì)定位
- <styletypestyletype="text/css">
- h2.pos_abs
- {
- position:absolute;
- left:100px;
- top:150px
- }
- </style>
- <h2classh2class="pos_abs">這是帶有絕對(duì)定位的標(biāo)題</h2>
- <p>通過絕對(duì)定位,元素可以放置到頁(yè)面上的任何位置。
- 下面的標(biāo)題距離頁(yè)面左側(cè)100px,距離頁(yè)面頂部150px。</p>
【編輯推薦】
- CSS絕對(duì)定位和相對(duì)定位的區(qū)別
- DIV+CSS中最小高度min-height設(shè)定
- CSS中border和clear兩大屬性用法揭秘
- 實(shí)現(xiàn)DIV居中布局三種途徑
- 解讀DIV CSS網(wǎng)頁(yè)布局中CSS無(wú)效十個(gè)原因