`
wanghailiang333
  • 浏览: 199163 次
  • 性别: Icon_minigender_1
  • 来自: 广西
社区版块
存档分类
最新评论

关于div固定位置显示的问题

CSS 
阅读更多

关于div固定位置显示的问题

 

 

div固定位置显示自己一直没有弄明白,今天在做网页的时候想在网页的两边加上些固定的图片,才查了资料,发现其实也不难,就是css的一些属性不清楚罢了。

(以下例子是固定位置显示,不会随滚动条的变动而改变位置)

 

div在网页右侧显示

<div id="div_right" style="position:absolute;right:0px;margin-right:0px;margin-top:40px;width:200px;height:100;background:red;">
</div>

 请注意属性:right,这是比较重要的固定div在右侧显示的属性,margin-right与margin-top是边缘与右侧和上侧边框的距离。若想让div固定在左侧就将right属性换成left属性就可以了。

 

 

分享到:
评论

相关推荐

    DIV固定位置

    `DIV固定位置` 的概念指的是将一个 `div` 元素设置为固定定位(fixed positioning),使其在页面上保持在特定的位置,即使用户滚动页面,该 `div` 也不会移动。这种技术在创建导航栏、侧边栏或固定通知等元素时特别...

    如何让DIV固定在页面的某个位置而不随着滚动条随意滚动

    "让DIV固定在页面的某个位置而不随着滚动条随意滚动" 在前端开发中,我们常常需要让某个DIV元素固定在页面的某个位置,而不随着滚动条的滚动而移动。这可以通过使用CSS的position属性来实现,特别是使用fixed值。...

    鼠标移动到div上显示制定信息或者div(自适应显示位置)

    同时,我们还需要计算"info-div"的显示位置,使其始终在"hover-div"下方并居中: ```javascript $(document).ready(function() { var hoverDiv = $('#hover-div'); var infoDiv = $('#info-div'); hoverDiv....

    div固定在屏幕顶部

    总的来说,"div固定在屏幕顶部"是网页布局中一个实用的技术,通过CSS的`position: fixed`属性可以轻松实现,而且可以结合响应式设计来优化不同设备的显示效果。这个知识点在许多网站和应用中都有广泛应用,是前端...

    div浮于页面固定位置、展开与隐藏、锚点定位

    本主题主要探讨如何让div元素浮于页面固定位置、实现展开与隐藏的效果,以及利用锚点进行精确定位。这些技巧对于创建交互性强、用户体验良好的网页至关重要。 一、div元素的固定定位 在CSS中,我们可以使用`...

    悬浮固定DIV悬浮固定DIV

    在网页设计中,"悬浮固定DIV"是一种常见的技术,它使得某个DIV元素在页面滚动时始终保持在屏幕的特定位置,如侧边栏导航、广告条或工具提示等。这种效果可以增强用户体验,使用户在浏览长页面时也能方便地访问或查看...

    div固定在某一位置(并png图片透明显示)

    在网页设计中,有时我们需要创建一个元素,如`div`,使其在页面滚动时始终保持在特定位置,这种效果通常称为“固定定位”(fixed positioning)。同时,如果该元素包含PNG图片,并希望在所有浏览器中实现透明效果,...

    jQuery插件实现DIV浮动在页面固定位置中

    标题中的“jQuery插件实现DIV浮动在页面固定位置中”是指使用JavaScript库jQuery来创建一个功能,使得HTML中的&lt;div&gt;元素能保持在用户滚动页面时的特定位置,通常这种效果被称为“固定定位”或者“吸附效果”。...

    javascrip 浮动在屏幕固定位置的div

    总结来说,"javascrip 浮动在屏幕固定位置的div"是通过结合HTML、CSS和JavaScript来实现的一种网页设计技术,用于创建始终在用户屏幕某个位置显示的交互元素。通过理解上述概念和步骤,你可以创建自己的浮动div并将...

    导航固定在div中变化

    标题中的“导航固定在div中变化”指的是在网页设计中,如何实现一个导航栏(通常是一个div元素)在用户滚动页面时始终保持在屏幕顶部显示,即使div的宽度发生变化也能正常工作。这种效果常被称为“固定定位”或者...

    Div浮动显示功能

    很好的div浮动层显示,一些下拉改为透明的浮动层,便于做查询等功能

    div100%平铺 浏览器缩小或在手机上查看 div背景显示不全bug的解决.rar

    然而,当浏览器窗口缩小或在移动设备上查看时,`div`的宽度和高度可能不足以显示完整的背景图片,尤其是当背景图片尺寸固定且较大时。这就会导致背景图片显示不全,出现视觉上的bug。 解决这个问题的一种方法是使用...

    多个iframe,显示其中一个frame中的div,并处于最上层显示

    在网页设计和开发中,有时候我们需要处理多个`iframe`(内联框架)并实现特定的交互效果,例如只显示其中一个`iframe`中的`div`元素,并确保它在所有其他元素之上,即处于最上层显示。这样的需求通常出现在需要创建...

    div模拟table滚动时表头固定,兼容ie6

    标题“div模拟table滚动时表头固定,兼容ie6”正是针对这一需求,描述了如何使用div元素来模拟表格的滚动,并确保在滚动过程中表头能够固定显示,同时实现列宽的自动适配,使得表头边框与表体边框对齐。 在传统的...

    jQuery实现将div的滚动条滚动到指定位置

    2. **滚动条**: 当div的内容超出其宽度或高度时,浏览器会自动显示滚动条,以便用户查看隐藏的内容。 3. **jQuery**: jQuery是JavaScript的一个库,提供了丰富的API,简化了JavaScript编程,如选择器、事件处理、...

    漂浮鼠标显示div

    `jquery.qtip-1.0.0-rc3.js`是这个插件的早期版本,它提供了丰富的自定义选项,如定位方式(如跟随鼠标、固定位置等)、样式、内容类型等。通过调用jQuery的`.qtip()`方法,我们可以轻松地为任何元素添加提示功能。...

    固定大小的div 自适应显示图片

    在网页设计中,让固定大小的`div`自适应显示图片是一项常见的需求。这涉及到CSS布局、图片响应式处理以及JavaScript的应用。以下是对这个主题的详细解析。 首先,`div`是HTML中的一个块级元素,可以用来组织网页...

    div弹出层 定位问题的 处理

    在实现弹出层时,我们通常将`div`设置为绝对或固定定位,使其能脱离文档流,独立于其他元素显示。 1. **绝对定位**:使用`position: absolute;`可以让`div`相对于最近的非静态定位祖先元素进行定位。如果没有这样的...

    html中一个div层在另外一个div或者img上显示

    对于本问题,我们需要使用`absolute`或`fixed`定位来使`div`层覆盖在另一个元素之上。 其次,了解CSS的层级概念,即`z-index`属性。`z-index`用于控制在同一堆叠上下文中的定位元素的前后顺序。具有更高`z-index`值...

    div左边点击链接右边显示内容特效

    这里的CSS代码将左侧容器设置为固定宽度并浮动,右侧内容区域则根据左侧容器的宽度进行定位。 最后,使用JavaScript(这里以jQuery为例)处理点击事件,实现点击链接后显示右侧内容: ```javascript $(document)....

Global site tag (gtag.js) - Google Analytics