小编Grz*_*nia的帖子

CSS - 各种颜色的圆形边框

有没有人知道如何在CSS中创建它,或者甚至可能.我知道如何制作四分之一圆,但我不知道如何以这种格式应用它.边框的小块需要有不同的颜色.

在此输入图像描述

css css3 css-shapes

7
推荐指数
4
解决办法
7332
查看次数

将支持从孩子传给父母React

WeatherForecast组件中,我需要将函数的返回值传递appColor给属性.然后从属性WeatherForecast需要被传递到classNameapp组件.新的反应.不确定如何将属性从子节点传递给组件.

class WeatherForecast extends Component {

  appColor(weatherData) {
    //Check for condition and return value
    return "example-color1"
  }

  render() {
    /************************************
    // Need to Pass returned value of Function into propery or variable?
    /************************************/ 
    let bgColor = appColor(weatherData);

    return (
      <div className="text-center col-xs-12">

         <h1 id="temp">{this.displayTemp(this.props.weather)}</h1>
         <h1>{this.displayCity(this.props.weather)}</h1> 

      </div>
    );
  }
}



export default class App extends Component {

  render() {
    return (
      <div className={"app-container" + this.AppColorPropertyClass}>

        <div className="main-wrapper">

            <WeatherForecast bgColorPropertyClass={this.AppColorPropertyClass} />

        </div> …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

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

克拉不会在第二次点击时旋转

我为carat一个bootstrap 创建了一个旋转函数dropup.问题是当我关闭时它没有转换(旋转)dropup.这是我的codepen的链接.http://codepen.io/theMugician/pen/OyjYed dropup没有在codepen中关闭和打开.只需注意克拉

<div class="dropup" id="divDropup">
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu text-left" aria-labelledby="dropdownMenu2">
        <li>PHONE</li>Stuff<li>{{basket.plan.phonePrice}}</li>
        <li>MONTHLY PLAN</li><li>{{basket.plan.planPrice}}</li>
        <li>ACCESSORIES</li><li>{{basket.accessoriesTotal}}</li>
        <li>BUNDLE</li><li>{{basket.bundle.price}}</li>
    </ul>
</div>
<footer id="cartFooter">
    <div class="row cartInfo">
        <div class="col-xs-4">
            <p><i class="zmdi zmdi-shopping-cart"></i> CART</p>
        </div>
        <div class="col-xs-4 text-center">
            <p>{{basket.total}}</p>
        </div>
        <div class="col-xs-4 text-right">
            <p><a ng-click="emptyBasket()"><span class="zmdi zmdi-delete"></span></a></p>
        </div>
    </div>
</footer>
Run Code Online (Sandbox Code Playgroud)

CSS

    .rotate {
    transform: rotate(0deg);
    transition: .3s;
}
.rotate2 {
    transform: rotate(180deg);
    transition: .3s;
}
Run Code Online (Sandbox Code Playgroud)

jQuery的

    $(document).ready(function(){ …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery twitter-bootstrap

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

标签 统计

css ×2

javascript ×2

css-shapes ×1

css3 ×1

html ×1

jquery ×1

reactjs ×1

twitter-bootstrap ×1