position 相关问题

位置是指元素相对于其容器的位置,通常在水平轴和垂直轴上。

Python PDF挖掘获取文本在每一行上的位置

我目前正在使用答案中提供的类:如何从pdf文件提取文本和文本坐标?提供的类非常有帮助,因为我可以获取每个文本的位置...

回答 1 投票 0

位置视图底部,不使用分隔符

如何在不使用垫片的情况下将视图放置在底部。我知道我可以实现将间隔符和视图放置在VStack中的方法,但是我不想使用间隔符,因为我不希望视图... ...>

回答 1 投票 0

无法在函数中调用窗口位置对象

JAVASCRIPT嗨,新手。因此,我有以下功能类似于冠军://要查找元素功能的位置,请执行getPosition(el){var xPos = 0; var yPos = 0; while(el)...

回答 1 投票 0

裁剪图像页脚并获得原始位置

我需要裁剪图像以仅获取页脚信息。有了这些信息,我得到了找到的文本的位置(使用pytesseract),但是只有页脚图像。因此,当我使用...

回答 1 投票 1

如何在CSS中移动div

如何在我更改div文本符号div的边距顶部时将文本位置移动到向上符号,它会用它来移动sidenav。页边距:-190px; z索引:3; text -...

回答 1 投票 -1

React Native(expo)中flatlist元素上的绝对子元素位置

当屏幕上方出现一些圆圈时,我想做一个小游戏。出现后,它们将向下拖动直到离开屏幕。为了使我有一个包含...

回答 1 投票 0

CSS-占父母空间的100%? [关闭]

我想在链接(a href)标记内创建一个跨度,我希望该跨度采用父链接元素的100%宽度和高度。我一直在尝试相对/绝对位置,但是没有任何效果。 ...

回答 5 投票 1


用于检测位置:粘滞何时触发的事件Demo IntersectionObserver

我正在使用新的职位:sticky(信息)来创建类似iOS的内容列表。它工作得很好,并且比以前的JavaScript替代方法(示例)优越得多,但据我所知...

回答 6 投票 33


将滚动条移动到数据表Primeface中的顶部

我正在使用Primefaces 5.1,可以将滚动条从底部的表移到顶部吗?

回答 1 投票 0

是否有可能通过插补近似丢失位置数据?

我想增加AIS或GPS数据的密度,以便随后进行更精确的分析。在研究期间,我遇到了不同的方法,例如插值,滤波...

回答 1 投票 1

根据尺寸的CSS定位差异

我在相对和绝对定位中犯了错误,但我不知道如何清除它,我尝试更改widht:auto&100%,但没有任何效果。以%给出宽度时,div在...

回答 1 投票 1

在argparse python3中查找参数的顺序

我有此代码parser = argparse.ArgumentParser()parser.add_argument('-input')parser.add_argument('-min')parser.add_argument('-max')args = parser.parse_args()我怎么知道...的顺序...]

回答 2 投票 1

如何使用CSS在屏幕底部对齐元素?

我如何在窗口底部对齐一个元素(与屏幕大小无关,但是将其保持在该位置,以便在减小窗口高度时(当用户更改窗口大小时)...

回答 2 投票 -1

我如何保持我的 标头保持在我的[[标头? ] >> 我是网站设计的初学者,刚开始设计自己的网站时遇到了问题。我是一名平面设计师,设计了一个我想要网站外观的模型。我完成了大部分工作,除了我坚持的这一部分之外,将 标头保留在 标头之上。这两个标头都位于循环播放的视频背景的顶部。现在他们并肩。我还想在两个标题之间添加一条水平线-这是我设计的一部分。以下是我的HTML和CSS代码。 I also attached an image of my design vs what I have now。预先谢谢你。 [如果有人对我有任何提示,或者知道可以帮助我的最佳视频教程,我将非常感谢。谢谢! H1和H2在“视频部分”下的class =部分中。 CSS代码和HTML @font-face{ src: url(fonts/KeepCalm-Medium.ttf); font-family: keepcalm;} @font-face{ src: url(fonts/GOTHIC.TTF); font-family: centurygothic;} body { margin: 0px; padding: 0px;} /**Video Section**/ .section { position: relative; text-transform: uppercase; width: 100%; height: 534px; display: flex; align-items: center; justify-content: center; overflow: hidden;} .section h1 { text-align: center; justify-content: center; height: 108px; width:342px; font-family: keepcalm; font-size:36px; color: #ffffff; font-weight:500; line-height: 60px; transform: scale(1.189,1.189); letter-spacing: 15px; margin: 0px; padding: 0px; z-index: 1; } .section span { font-size: 48px;} hr { display: block; z-index: 1;} .section h2{ width: 181px; height: 22px; font-family: centurygothic; color: #ffffff; font-size:35px; font-weight: 400; letter-spacing: 9px; z-index:2; } .video-container { position: absolute; top: 0; left: 0; width: 100%;} /*Topbar Section*/ .topbar { margin: 0px; } .topbar { background-color: #e8e8e8; font-family: KeepCalm; font-size: 14px; align-items:flex-start; color: #000000; list-style: none; text-decoration: none; text-align: left; padding: 0px 0 0px 70px;} .topbar > li { display: inline-block; padding: 0 20px 0 20px;} .topbar > li > a { text-decoration: none; color: #000000;} .phone { width:20px; padding: 4px 0 0px 4px } .mail { height: 14px; } /**Logo Section**/ .logo{ float:left; padding-bottom: 10px; padding-left: 20px;} /**Logo Text**/ .logotext { font-size: 14px; position: absolute; left: 140px; font-family: KeepCalm; float:left; padding-bottom: 10px; } .logotext span { font-size: 14px; display: block; line-height: 14px; font-family: CenturyGothic; font-weight: 400; } .logotext span span { font-size: 14px; display: inline; line-height: 14px; font-family: CenturyGothic; font-weight: 400; background: #e8e8e8; } /*Navigation Responsive*/ .selector-for-some-widget { box-sizing: content-box;} .nav-item { background-color: #fff; font-family: KeepCalm; font-size: 14px; align-items:flex-start; color: #000000; list-style: none; text-align: right; padding: 20px 0 20px 0px;} .nav-item { display: inline-block; padding: 0 20px 0 20px;} .nav-item { text-decoration: none; color: #000000;} .navbar-light .navbar-nav .nav-item .nav-link:hover { color: #e8e8e8;} /*Topbar & Navigation Responsive*/ @media (max-width: 768px){ .logo{ width:5em; padding-bottom: 1px; padding-left: 0px; } .logotext { font-size: 0.7em; line-height: 9pt; padding-bottom: 1px; padding-right: 100px;} .logotext span { line-height: 9pt; font-size: 0.8em; } .logotext span span { background: #FFFFFF; font-size: 1em; } .video-container {display: none;} } @media (max-width: 580px){ .mail{width: 0px;} .hotmail{font-size: 0px;} .video-container {display: none;} } @media (max-width: 350px){ .topbar {font-size: 0px;} .phone{ width:0px;} .mail {display: 0px;} .logotext { font-size: 0px;} } <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link href="testtry.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <title>testtry</title> </head> <body> <!--Topbar--> <div class="topbar"> <ul class="topbar"> <img src="Images/phone.png" alt="Call me at" class="phone"> <li class="topbar topbartext">416-948-2164</li> <img src="mail1.png" alt="Email me at" class="mail"> <li class="hotmail"><a href="">[email protected]</a></li> </ul> </div> <!--Navbar Responsive--> <div class="Navcontainer"> <nav class="navbar navbar-expand-lg navbar-light"> <a href="#"><img src="Logo1.png" alt="Micaela Butron Logo" class="logo"></a> <h1 class="logotext"> I'm Micaela Butron. <span>an <span>Urban Designer</span>, + Graphic Designer.</span> </h1> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav ml-lg-auto"> <li class="nav-item active"><a class="nav-link active" href="#">Home</a></li> <li class="nav-item active"><a class="nav-link active" href="#">Resume</a></li> <li class="nav-item active"><a class="nav-link active" href="#">Portfolio</a></li> <li class="nav-item active"><a class="nav-link active" href="#">Contact</a></li> </ul> </div> </nav> </div> <!--VideoSection--> <div class="section"> <h1>Micaela <span>Butron</span></h1> <h2>Designer</h2> <div class="video-container"> <video autoplay loop muted> <source src="Images/Videos/Video.mp4" type="video/mp4"> </video> </div> </div> <!--Bootstrap Javascript Link--> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> </body> </html> 我是网站设计的初学者,刚开始设计自己的网站时遇到了问题。我是一名平面设计师,设计了一个我想要网站外观的模型。除此以外,我已完成大部分工作...

回答 2 投票 0

我如何找到功能性反应天然组分中的组分位置

我正在尝试在渲染后动态查找组件的位置。我试图使用useRef和getBoundingClientRect()(请参见下面的代码)。我得到的答复是这个。 myRef ....

回答 1 投票 0

背景色在对象固定后不起作用:

在屏幕底部创建一个固定的选取框。但是,一旦物体固定,背景颜色(#ffffff)就会消失。我试过将它添加到几个不同的地方,但是没有运气。什么...

回答 1 投票 0

“滚动容器内的CSS位置元素已固定”

我想知道是否有人为此找到了解决方案?我正在寻找一种将元素附加到滚动容器HTML顶部的解决方案: ]]]]] 我认为您的解决方案通过position:sticky。似乎像position:fixed,但尊重其父母的相对位置。 遗憾的是,这是一项实验性功能,仅在Chromium中受支持。您可以在this test page中查看更多详细信息。 我想到的纯CSS解决方案是对标记进行了少许更改。您可以这样设置仅用于“元素”的容器: <div class="cont_elements"> <div class="element">......</div> ..... </div> 然后将溢出内容提供给该内部容器。现在,您的标题停留在顶部。 Here's a working demo。 jQuery UI为此添加了position()实用程序方法,这将使您的生活更轻松。 $( "#someElement" ).position({ of: //Element to position against, my: //which position on the element being positioned, at: //which position on the target element eg: horizontal/vertical, offset: // left-top values to the calculated position, eg. "50 50" }); 绝对帮助过我。 在这种情况下,解决方案是将标题弹出到滚动元素之外: <div class="header">title</div> <div class="container"> <div class="element">......</div> <div class="element">......</div> </div> 尽管可能的话,您可能应该拥有更好的语义元素(只是在这里猜测): <h3>title</h3> <ul> <li>......</li> <li>......</li> </ul> 您将找到有关此解决方案的最佳答案是此链接How to fixed scroll div after certain height and stop after reach other div? 我希望这可以节省一些谷歌搜索时间 var navWrap = $('#navWrap'), nav = $('nav'), startPosition = navWrap.offset().top, stopPosition = $('#stopHere').offset().top - nav.outerHeight(); $(document).scroll(function () { //stick nav to top of page var y = $(this).scrollTop() if (y > startPosition) { nav.addClass('sticky'); if (y > stopPosition) { nav.css('top', stopPosition - y); } else { nav.css('top', 0); } } else { nav.removeClass('sticky'); } }); body { height:1600px; margin:0; } #navWrap { height:70px } nav { height: 70px; background:gray; } .sticky { position: fixed; top:0; } h1 { margin: 0; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit morb ,o vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <div id="navWrap"> <nav> <h1>I stick to the top when you scroll down and unstick when you scroll up to my original position</h1> </nav> </div> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit , morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit morb ,o vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <br> <div id="stopHere"> <h3 style="color:red">I want it stop fixed scrolling here. If I'm back to scrolling up, It will follow also to original position.</h3> </div> <br> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit morb ,o vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit , morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit morb ,o vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit , morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> <p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit morb ,o vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror. Nigh tofth eliv ingdead.</p> 这是我想出的使用position: sticky的解决方案(很遗憾,没有IE): https://codepen.io/waterplea/pen/JjjMXzR 想法是在滚动容器的顶部有一个0高度的粘性容器,因此它会粘住,但不会将任何内容压入下面,然后将您的内容绝对放置在其中。这样,您就可以拥有宽度,但没有高度,因此只能像我在示例中使用button那样从顶部定位一些东西。

回答 5 投票 31

现代OpenGL:如何获取立方体的向量位置?

glm :: mat4 yellow_bone_obj_mat = m_bone_animation-> get_yellow_mat(); glUniformMatrix4fv(glGetUniformLocation(shader.program,“ model”),1,GL_FALSE,glm :: value_ptr(yellow_bone_obj_mat)); bone_obj-> ...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.