小编Nur*_*lla的帖子

渐变与CSS褪色

我的问题是关于渐变的渐变:渐变 - 从上到下,以及渐变 - 从左到右.

例:

在此输入图像描述

代码是:

background-image: 
  linear-gradient(0deg, rgba(198,83,165,.95) 0%, rgba(198,86,51,.95) 100%),
  linear-gradient(90deg, transparent 50%, rgba(0,0,0,.95) 100%);
opacity: 0.949;
Run Code Online (Sandbox Code Playgroud)

我的结果如下.

在此输入图像描述

如你所见,它不会淡化渐变,它看起来像这个渐变后面的单独图层.有没有其他方法来实现这个?

html css svg linear-gradients css3

13
推荐指数
2
解决办法
3032
查看次数

Angular 2底部粘滞的页脚

我正在Angular 2中构建一个项目,我需要一个粘性页脚,它总是必须位于页面的底部,而不是固定的.示例:http://codepen.io/chriscoyier/pen/uwJjr

'app'组件的结构如下:

<header-main></header-main>
<router-outlet></router-outlet>
<footer>...</footer>
Run Code Online (Sandbox Code Playgroud)

可能这个问题与Angular本身无关,而只与CSS有关.但是,我尝试像这样实现它:

app {
   min-height: 100%;
   position: relative;
}

footer {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 271px;
}
Run Code Online (Sandbox Code Playgroud)

结果太可怕了: 在此输入图像描述

有趣的是,如果我在检查员中关闭页脚的位置,然后再次打开,页脚就会变好: 在此输入图像描述

解决方案:

app {
  min-height: 100%;
  width: 100%;
  margin-bottom: -271px;
  display: table;
}

header-main,
router-outlet,
footer{
  display: table-row;
}

header-main {
 height: 60px;
}

router-outlet {
  position: absolute;
}

footer {
  height: 271px;
}
Run Code Online (Sandbox Code Playgroud)

html css angularjs

13
推荐指数
2
解决办法
2万
查看次数

Http.post错误:map不是Angular 2中的函数

我正试图通过http.post函数从url获取数据.但是我收到了错误.app.component.ts文件的源代码:

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {Http, HTTP_PROVIDERS, Headers} from 'angular2/http';
@Component({
selector: 'my-app',
template: `
 <div>
  <button (click)="postData()">Post Data</button>
  <p>Posted the following values:</p>
  <div>{{postResponse.id}}</div>
  <div>{{postResponse.name}}</div>
 </div>`
})
export class AppComponent {
 result: Object;
 http: Http;
 postResponse = new Person();

 constructor(http: Http) {
    this.http = http;
 }

 postData(){
    var headers = new Headers();
    headers.append('Content-Type', 'application/json');

    this.http.post('http://141.79.39.454:8008/the-link-something-like-this...', JSON.stringify({"id": 1, "name": "?????"}),{headers:headers})
    .map(res => res.json())
    .subscribe((res:Person) => this.postResponse = res);
 }
}

class Person{
 id:number;
 name:string;
}

bootstrap(AppComponent, …
Run Code Online (Sandbox Code Playgroud)

angular

4
推荐指数
1
解决办法
9786
查看次数

身份验证错误:预检响应具有无效的 HTTP 状态代码 405

我想实现身份验证。实际上,我的项目是在 Angular 2 Beta 中构建的,但我使用身份验证示例用于测试目的。我有自己的 API,只是将其 url 添加到了这个示例项目中。它不起作用)它显示此错误:

Failed to load resource: the server responded with a status of 405 (Method Not Allowed)
Fetch API cannot load http://blah-blah-blah. Response for preflight has invalid HTTP status code 405
Run Code Online (Sandbox Code Playgroud)

这是登录方法:

login(event, phone, password) {
event.preventDefault();
window.fetch('http://blah-blah-blah', {
  method: 'POST',
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    phone, password
  })
})
.then(status)
.then(json)
.then((response:any) => {
  localStorage.setItem('access_token', response.id_token);
  this.router.parent.navigateByUrl('/home');
})
.catch((error) => {
  alert(error.message);
  console.log(error.message);
});
}
Run Code Online (Sandbox Code Playgroud)

angular

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

标签 统计

angular ×2

css ×2

html ×2

angularjs ×1

css3 ×1

linear-gradients ×1

svg ×1