小编Mic*_*cky的帖子

Bootstrap 导航栏,全高导航栏折叠但带有奇怪的动画

我设法让包含扩展菜单的 div 覆盖整个视图(100vh)。我注意到很酷的动画,虽然它正在扩展自己,但只工作到 li 内容的结尾(最后一个菜单链接),然后速度增加或只是动画停止工作,导航栏折叠最终到达结尾查看端口,但不是一个很好的方式。

你知道为什么吗?它是引导 javascript 功能吗?你知道如何解决吗?

我复制了这个小提琴中的代码

body {
  padding-top: 53px;
}

.pids-navbar{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  z-index: 99999;
}

.pids-navbar-toggle .pids-icon-bar {
  display: block;
  width: 16px;
  height: 1px;
  border-radius: 1px;
}

.pids-navbar-toggle {
  margin-top: 14px;
  margin-bottom: 14px;
  margin-right: 0px;
  float: left;
}

.pids-navbar-nav {
  margin: 0px -15px;
  font-weight: lighter;
}

.pids-navbar-collapse {
  border: 0px;
  height: calc(100vh - 60px);
}
.full-height {
  height: 100%;
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!-- Latest compiled and minified CSS --> …
Run Code Online (Sandbox Code Playgroud)

html javascript css twitter-bootstrap

3
推荐指数
1
解决办法
2806
查看次数

CSS Scroll Snapping,垂直不起作用

我使用这篇文章作为参考,在具体的工作片段中,但在我的页面(下面的脚本)中,垂直快照滚动不起作用.你知道为什么吗?

.parent {
    height: 100vh;
    scroll-snap-type: mandatory;
    scroll-snap-points-y: repeat(100vh);
    scroll-snap-type: y mandatory;
}

section {
    height: 100vh;
    scroll-snap-align: start;
    position: relative;
}

.one {
  background-color: red;
}
.two {
  background-color: blue;
}
.three {
  background-color: grey;
}
.four {
  background-color: green;
}
Run Code Online (Sandbox Code Playgroud)
<div class="parent row">
    <section class="one">
    </section>
    <section class="two">
    </section>
    <section class="three">
    </section>
    <section class="four">
    </section>
</div>
Run Code Online (Sandbox Code Playgroud)

css

3
推荐指数
2
解决办法
6168
查看次数

引导程序,我不能将行高降低到一定数量以下

我的跨度文本应更改为:

font-size: 13px;
line-height: 1.38;
Run Code Online (Sandbox Code Playgroud)

我使用Bootstrap注意到,行高没有任何作用。只有将值设置为1.6以上时,我才能看到更改...

我添加了!important,但是这并没有改变行之间的巨大空间,该空间应小于设计器原型中显示的空间。

您知道为什么会这样吗?

css twitter-bootstrap-3

2
推荐指数
1
解决办法
1378
查看次数

如何使用 CSS 删除和替换 HTML 标记中的内容?

我需要更改链接的内容,但我只能更改我正在处理的页面的 CSS。我尝试使用contentin:before:after伪元素中的属性。但我没有找到一种方法来用新值替换该值。我只能将内容附加到标签之间指定的值、开头和结尾,而不是像我需要的那样完全替换它。

a:before {
  content: 'ciao 1'
}

a:after {
  content: 'ciao 2'
}
Run Code Online (Sandbox Code Playgroud)
<a href="https://www.w3schools.com/css/">CSS Tutorial</a>
Run Code Online (Sandbox Code Playgroud)

我该怎么做才能真正“替换”链接标签的内容?

html css pseudo-element

0
推荐指数
1
解决办法
6395
查看次数