删除内联剪辑路径div之间的空格

Question

我制作了三个内联div，每个div都带有图像和标题。标题和图像都使用css clip-path属性。图像和标题包含在内 $ node index.js myparam1 myparam2 myparam3课程。代码工作正常，但我希望这些div之间没有空格。

Link to the fiddle

我的HTML代码：

.gallery-inner

我的CSS代码：

<div class="gallery">
    <div class="gallery-inner">
        <img src="http://dummyimage.com/800" class="img-responsive img-slant--1">
        <div class="caption red">
            <h3>Lorem Ipsum Dolor</h3>
        </div>
    </div>
    <div class="gallery-inner">
        <img src="http://dummyimage.com/800" class="img-responsive img-slant--2">
        <div class="caption blue">
            <h3>Lorem Ipsum Dolor</h3>
        </div>
    </div>
    <div class="gallery-inner">
        <img src="http://dummyimage.com/800" class="img-responsive img-slant--3">
        <div class="caption orange">
            <h3>Lorem Ipsum Dolor</h3>
        </div>
    </div>
</div>

我有什么办法可以删除.img-slant--1{ -webkit-clip-path: polygon(0 0, 100% 0%, 80% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0%, 80% 100%, 0% 100%); } .img-slant--2{ -webkit-clip-path: polygon(20% 0, 100% 0%, 80% 100%, 0% 100%); clip-path: polygon(20% 0, 100% 0%, 80% 100%, 0% 100%); } .img-slant--3{ -webkit-clip-path: polygon(20% 0, 100% 0%, 100% 100%, 0% 100%); clip-path: polygon(20% 0, 100% 0%, 100% 100%, 0% 100%); } .gallery-inner{ position: relative; width: 33.333333%; float: left; } .gallery-inner img{ margin: 0; padding: 0; } .caption { width: 100%; } .red{ background-color: #a31d22; -webkit-clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%); clip-path: polygon(0 0, 80% 1%, 100% 100%, 0% 100%); } .blue{ background-color: #33658a; -webkit-clip-path: polygon(0 0, 80% 0, 100% 100%, 20% 100%); clip-path: polygon(0 0, 80% 0, 100% 100%, 20% 100%); } .orange{ background-color: #ca5a27; -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%); } h3 { margin: 0; padding: 60px; color: #fff; } 之间的空格吗？

图像有助于理解我想要的东西。以下是示例图片：

Answer 1

尝试在CSS文件中添加以下.gallery：

#import "TESTWebViewController.h"
@interface TESTWebViewController ()

@end

@implementation TESTWebViewController

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{ self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
    // Custom initialization
}
return self;
}

- (void)viewDidLoad { 
 _webView.delegate = self;
[super viewDidLoad];

// Do any additional setup after loading the view.
NSURL *App = [NSURL URLWithString:@"http://website.com/"];
NSURLRequest *Request = [NSURLRequest requestWithURL:APP ];
[_webView loadRequest:Request ];


}


-(void)dismissViewControllerAnimated:(BOOL)flag completion:(void (^)    
(void))completion

{
if ( self.presentedViewController)
{
    [super dismissViewControllerAnimated:flag completion:completion];
}
}

-(void)webViewDidStartLoad:(UIWebView *)webView
{
[self.activityIndicator startAnimating];
self.activityIndicator.hidden = NO;
}

-(void)webViewDidFinishLoad:(UIWebView *)webView
{
[self.activityIndicator stopAnimating];
self.activityIndicator.hidden = YES;
}



- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

@end

我希望它有所帮助。我确定它有效。