小编bro*_*lyt的帖子

我试图让 Bootstrap 行中的内容按比例缩小，而不是在移动设备上分成单列。我该怎么办呢？这是我到目前为止所拥有的一个示例：

<div class="row justify-content-center">
    <div class="col-xs-4" style="padding:0!important;"> 
        <a class="btn btn-light" style="width: 200px; height: 200px;>
            <h2> title </h2>
            <img src="" style="width:100px; height:100px;">
        </a>
    </div>
    <div class="col-xs-4" style="padding:0!important;"> 
        <a class="btn btn-light" style="width: 200px; height: 200px;>
            <h2> title </h2>
            <img src="" style="width:100px; height:100px;">
        </a>
    </div>
    <div class="col-xs-4" style="padding:0!important;"> 
        <a class="btn btn-light" style="width: 200px; height: 200px;>
            <h2> title </h2>
            <img src="" style="width:100px; height:100px;">
        </a>
    </div>
</div>

当我在手机上打开它时，每一列在页面上显示为一行。我希望所有三个在移动设备上位于同一行。

我正在创建一个名为“new-app”的项目。成功安装 gatsby 后，我尝试运行命令“gatsby new my-app”。我总是收到一个错误，其中指出：

从 git 吃新网站时出错： https ://github.com/gatsbyjs/gatsby-starter-default.git

命令失败，退出代码 2 (ENOENT)： git clone https://github.com/gatsbyjs/gatsby-starter-default.git my-app --single-branch spawn git ENOENT

错误：命令失败，退出代码 2 (ENOENT)： git clone https://github.com/gatsbyjs/gatsby-starter-default.git my-app --single-branch spawn git ENOENT

• enoent.js:6 notFoundError [npm]/[gatsby-cli]/[cross-spawn]/lib/enoent.js:6:26

• enoent.js:40 verifyENOENT [npm]/[gatsby-cli]/[cross-spawn]/lib/enoent.js:40:16

• enoent.js:27 ChildProcess.cp.emit [npm]/[gatsby-cli]/[cross-spawn]/lib/enoent.js:27:25

• child_process.js:248 Process.ChildProcess._handle.onexit 内部/child_process.js:248:12

是否可以在 useState 挂钩中定位 className？target.className == "test"是我正在特别关注的。是否可以查找一个类，并且该类是否处于活动状态，隐藏/显示另一个 div 页面元素？

我可能对此还很遥远，但是正在寻求建议。

// Click tracking of className "test"
const [isSelected, setIsSelected] = useState(true)
const selectToggle = (target.className == "test") =>
  setIsSelected({ ...isSelected, [test]: !isSelected[test] })

我想要 Bootstrap 警报和关闭按钮功能。我已经在我的页面头中包含了 JQuery 和 Bootstrap javascript 文件，但不想要其中的 CSS，因为它覆盖了大量的样式。

目前，我已将 Bootstrap 的这些部分添加到我自己的 css 中，以使警报和关闭按钮出现。

.alert {
    padding: 8px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px
}

.alert h4 {
    margin-top: 0;
    color: inherit
}

.alert .alert-link {
    font-weight: 700
}

.alert>p,
.alert>ul {
    margin-bottom: 0
}

.alert>p+p {
    margin-top: 5px
}

.alert-dismissable,
.alert-dismissible {
    padding-right: 35px
}

.alert-dismissable .close,
.alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1 …

我有一个反应组件和内部,我想使用三元运算符显示一个子组件,似乎没有工作

这是我的代码

import React, {Component} from 'react'
// import HeaderProduct from '../components/header_product.co;ntroller';
import HeaderProduct from './../../../components/header_product.controller';
import FooterController from './../../../components/footer.controller.js';
import  './../../../../css/PandC/customerPolicies.css';
import ImageComponent from "./../imageComponent";
import SandD from "./CPC/SandD.js";
import InShipping from './CPC/Inshipping.js';
import Payments from './CPC/Payments.js';      



class customerPolicies extends Component{

    state = {
        SandD: true,
        Cancellation: false,
        Payments: false,
        EandR: false,
        InternationalShipping: false,
        ExpressDelievery: false
    }

    contentToDisplay = (event) => {
        Object.keys(this.state).forEach(key => {
           if(event.target.name == key) {
              this.setState({[event.target.name]: true})
           } else {
               this.setState({[key]: false})   
           }
        })

    } …

我正在尝试在 Jekyll 项目中配置 jQuery。我在引用我的脚本标签时遇到问题（如果我包含一个 CDN 就好了）。

我正在阅读一些 github-pages 可能无法处理您的 node_modules 的问题。但是，我只是在本地工作，没有运气。

js 文件会以不同的方式加载而不是在sass:> 下load_paths:吗？有关系吗？（Sass 文件工作正常，但没有 js 文件工作）

_config.yml

sass:
  load_paths:
    - _sass
    - node_modules/

我的页脚：

<script src="{{'/node_modules/jquery/dist/jquery.min.js' | prepend: site.baseurl}}"></script>

错误：

[2019-03-27 12:44:36] 找不到错误`/node_modules/jquery/dist/jquery.min.js'。

我正在检查用户是否在小于768像素的设备上，如果我要将isTop设置为false。我遇到了一些问题。一切看起来都还不错，但我不断收到此错误消息：

TypeError：_this2.state.isTop不是函数

我正在使用的是：

componentDidMount() {
    this.updateWindowDimensions();
    window.addEventListener('resize', this.updateWindowDimensions);
    document.addEventListener('scroll', () => {
        const isTop = window.scrollY < window.innerHeight - 50;
        if (isTop !== this.state.isTop) {
          this.setState({ isTop })
        }
    });

    this.checkWidth = () => {
        const match = window.matchMedia(`(max-width: 768px)`);
        if (match) {
            this.state.isTop(false);
        }
    };

    this.checkWidth();
    window.addEventListener('resize', this.checkWidth);
}

任何帮助，将不胜感激

我有一个 div，其中包含具有不同 srcsets 的图像。我已将 div 和图像宽度和高度设置为 100%，以便 img 包含整个页面，因此很容易假设，根据设备屏幕，它会显示图像的更大或更低部分。 t 适合 div。我对此表示同意，但问题是我希望图像由顶部显示，这样如果高度不适合屏幕高度的 100% 并且 img 的一部分被剪切，那么它就是底部的，但图像开始从底部加载，而顶部则被剪切。

.portada {
  width: 100%;
  height: 100%;
}

#portadaImg {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.portadaLetras {
  position: absolute;
  color: #FFFFFF;
  font-size: 2em;
  width: 33%;
  min-width: 170px;
  text-align: center;
  background-color: #000000;
}

.centerBoth {
  display: flex;
  justify-content: center;
  align-items: center;
}

<div class="portada centerBoth">
  <img id="portadaImg" class="img-fluid" srcset="images/portada/portada-xl.jpg 2400w,
                  images/portada/portada-l.jpg 1200w,
                  images/portada/portada-md.jpg 992w,
                  images/portada/portada-tablet.jpg 768w,
                  images/portada/portada-mobile.jpg 458w" src="images/portada/portada-mobile.jpg" alt="Foto de portada">
  <div class="portadaLetras"> …

到目前为止我所拥有的（某种例子，不是真实的）：

html：

<html>
<body>
  <div id="article">
    <h1>TITLE</h1>
    <p>text</p>
  </div>
</body>
</html>

css

#article {
  color:red;
  border-bottom: 1px solid black;
}

问题！

我无法将底部的边框和 div 本身分开

这可能对你有帮助>> http://dl.dropbox.com/u/22271794/div.PNG

解决了！！

人力资源标签帮助了我！！在 Google 上搜索 > HR TAG STYLING 就是这样（边距为零，更改颜色）