小编Int*_*ive的帖子

带边框的方形div.只显示角落

我有一个我在网站上使用的播放器.
我想改变播放按钮的外观.

我想用虚线边框做这个,然后增加破折号之间的空间.那没用.

我无法使用图像.有CSS(3)解决方案吗?

我希望它看起来像这样.

这真的是关于角落!

在此输入图像描述

-------------更新----------------

所以我使用了@Naila的解决方案来使它工作.针对以下问题运行:

我使用Video.js插件WordPress,我正在创建一个新的皮肤

当我跟着时,css我发现已经有一个::before处理游戏箭头的-pseudo.

::before箭头的-pseudo表示宽度为100%,这有助于箭头位于中心.因为我使用30%的宽度使边框成为一个角落.这会覆盖100%的早期宽度.导致以下结果:

在此输入图像描述

这是:
CodePen

如果您刚刚在CSS字段中浏览此CSS,您将获得我现在所处的位置并查看问题:

/*
Player Skin Designer for Video.js
http://videojs.com

To customize the player skin edit 
the CSS below. Click "details" 
below to add comments or questions.
This file uses some SCSS. Learn more  
at http://sass-lang.com/guide)

This designer can be linked to at:
http://codepen.io/heff/pen/EarCt/left/?editors=010
*/

// The following are SCSS variables to automate some of the values.
// …
Run Code Online (Sandbox Code Playgroud)

html css css-shapes

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

从导入的.csv文件中删除BOM()

我想从导入的文件中删除BOM,但它似乎不起作用.

我试着preg_replace('/[\x00-\x1F\x80-\xFF]/', '', $file);和一个str_replace.

我希望有人看到我做错了什么.

$filepath = get_bloginfo('template_directory')."/testing.csv";
            setlocale(LC_ALL, 'nl_NL');
            ini_set('auto_detect_line_endings',TRUE);
            $file = fopen($filepath, "r") or die("Error opening file");
            $i = 0;
            while(($line = fgetcsv($file, 1000, ";")) !== FALSE) {
                if($i == 0) {
                    $c = 0;
                    foreach($line as $col) {
                        $cols[$c] = utf8_encode($col);
                        $c++;
                    }
                } else if($i > 0) {
                    $c = 0;
                    foreach($line as $col) {
                        $data[$i][$cols[$c]] = utf8_encode($col);
                        $c++;
                    }
                }
                $i++;
            }
Run Code Online (Sandbox Code Playgroud)

-----------已
解决的版本:

setlocale(LC_ALL, 'nl_NL');
ini_set('auto_detect_line_endings',TRUE);
require_once(ABSPATH.'wp-admin/includes/file.php' );

$path = get_home_path();        
$filepath …
Run Code Online (Sandbox Code Playgroud)

php csv import fgetcsv

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

PHP在验证错误后保留输入的值

我有一个需要验证的简单表单.
我用这个empty()函数做了这个.如果验证未通过,则会向用户发出警报.创建此警报后,所有输入的值都将消失.

我想保留它们.

这就是我做的:

<form id="" name="" action="<?php echo get_permalink(); ?>" method="post">
    <table>
        <tr>
            <td>
                Name:<input type="text" id="name" name="name">
            </td>
        </tr>
        <tr>
            <td>
                <input class="submit-button" type="submit" value="Send" name="submit">
            </td>
        </tr>
    </table>
</form>
<?php
    if($_POST["submit"]){
        if (!empty ($_POST["name"])){
          // do something
        }else{
            ?>
            <script type="text/javascript">
                alert('U heeft niet alle velden ingevuld. Graag een volledig ingevuld formulier versturen');
            </script>
            <?php
        }
?>  
Run Code Online (Sandbox Code Playgroud)

php validation error-handling

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

2 个 div 彼此相邻对齐,分别为 75% 和 25%

我需要有两个彼此相邻的 div。左侧 div 的宽度为 75%,右侧为 25%。左 div 的内容必须左对齐,右 div 右对齐。

这就是我所做的:

<div class="header_menu">
    <div class="links">
        Home Contact
    </div>
    <div class="social_media">
        Contact twitter linkedin
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.header_menu{
border-bottom:1px solid #CCC;   
}

.links{
width:75%;
display:inline;
}
.social_media{
width:25%;
display:inline;
}
Run Code Online (Sandbox Code Playgroud)

我尝试添加一个float:left;andfloat:right;但随后边框不再放置在底部......???

M。

html css

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

SVG 动画 G 元素

我目前正在学习如何使用 CSS 为 svg 对象设置动画。

我现在知道如何为路径设置动画:

@keyframes stroke_fill {
    0% {
        fill: white;
    }
    50% {
        fill: white;
        stroke-dashoffset: 0;
    }
    100% {
        fill: black;
        stroke-dashoffset: 0;
    }
}

.animation{
    animation: stroke_fill 4s ease forwards;
    stroke-dasharray: 324.774;
    stroke-dashoffset: 324.774; 
}
Run Code Online (Sandbox Code Playgroud)

组合在一起的路径显示在<g>标签中。
是否可以为<g>标签设置动画?

如果所有孩子都有相同的动画和相同的时间,那就太好了。
现在,如果我运行一个复杂的 svg 文件,我必须为每条路径指定一个类,这将花费大量时间。

分组进行会节省很多时间。

这是一个小提琴:https : //jsfiddle.net/vvvwcrdy/

css animation svg

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

grid-column-gap 在行中最后一个 div 的末尾添加间隙

我一直在尝试使用 css 中的网格并遇到以下问题。
我创建了一个包含几个divs的容器

.container创建了一个由 5 个项目组成的网格,宽度为 20%。

我添加了grid-column-gap并注意到它在容器中造成了溢出。我发现它grid-column-gap增加了它的grid-template-columns价值。所以我把它的值改了 19%。

现在项目适合网格。但是我的理解是grid-column-gapdivs之间添加。我现在所拥有的是最后一项在右侧也包含一个间隙。

我想在divs之间而不是在最后有间隙。请看小提琴

谁能解释我做错了什么?

html css grid css-grid

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

WooCommerce 查看所有有变化的产品

我有一个 WooCommerce 商店,里面有各种不同的产品。

我想创建某种导出(在页面上),向我显示所有产品,包括表格中的变体。

我正在查看所有产品并创建了一个循环来获取变体,但它只向我显示了一个产品变体。

<?php
/*
Template Name: Store Management
*/
if (!is_user_logged_in() || !current_user_can('manage_options')) wp_die('This page is private.');
// Get
$args = array(
    'post_type' => 'product',
    'numberposts' => -1,
);
$products = get_posts( $args );
echo '<pre>';
print_r($products);
echo '</pre>';

foreach($products as $product):

    $args = array(
        'post_parent' => $plan->ID,
        'post_type'   => 'product_variation',
        'numberposts' => -1,
    ); 

    $product = wc_get_product( $product->ID );

    $variations = $product->get_available_variations();
    echo '<pre>';
    print_r($variations);
    echo '</pre>';

endforeach;

?>
Run Code Online (Sandbox Code Playgroud)

谁能告诉我如何获得所有产品的所有变体?

M。

php wordpress woocommerce

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

WordPress菜单放在标题之外

如果用户转到主页以外的页面,则我的标题会更改布局.

除了功能,一切正常wp_nav_menu.

首先,我检查用户是否在主页上.根据该结果,用户将显示两个标题之一.

这是代码:

<?php 
    $menu = wp_nav_menu( array( 'theme_location' => 'hoofdmenu' ) );
    echo is_front_page() ? '' : '
    <header>
        <div class="hoofdmenu">
            <div class="hamburger">
                <a href="#" id="click-a"><img width="80" height="80" src="'.get_bloginfo('template_directory').'/images/hamburger.png"></a>
            </div>
            '.$menu.'
        </div>
    </header>';
?>
Run Code Online (Sandbox Code Playgroud)

为了保持简短,我删除trueif语句的值.

现在我遇到的问题是菜单完全放在了外面 header

这是HTML输出:

<div class="menu-hoofdmenu-container">
    <ul id="menu-hoofdmenu" class="menu">
        <li>Menu item 1</li>
        <li>Menu item 2</li>
        <li>Menu item 3</li>
    </ul>
</div>      
    <header>
        <div class="hoofdmenu">
            <div class="hamburger">
                <a href="#" id="click-a"><img width="80" height="80" src="http://www.url.nl/wp-content/themes/themename/images/hamburger.png"></a>
                </div>
            </div>
        </div>
    </header>
Run Code Online (Sandbox Code Playgroud)

有关为什么wp_nav_menu放在外面的任何想法 …

php wordpress wp-nav-menu-item

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

CSS 动画不透明度(0) 回到 1

我正在使用 a@keyframes从 0% 到 50% 再到 100%。
在百分比期间,我想更改 svg 元素的行为。

@keyframes scale {
0% {
    transform: scale(0);
    transform-origin: 50% 50%;
}
50% {
    transform: scale(1);
    transform-origin: 50% 50%;
}
100% {
    opacity:0;
}
}

.head_top{ 
    animation: scale 1s ease-in-out 1 backwards;
}
Run Code Online (Sandbox Code Playgroud)

SVG 元素:

<g><!-- HEAD TOP -->
    <path class="head_top" d="M381,230.571h.008A191.367,191.367,0,0,1,555.278,342.83a177.166,177.166,0,1,0-348.555,0A191.373,191.373,0,0,1,381,230.571Z" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="5"/>
</g>
Run Code Online (Sandbox Code Playgroud)

所以元素从 0% 到 50% 从 ascale(0)到 ascale(1)
从 50% 到 100%opacity到 0。
这一切都有效。然而,在opacity(0)到达之后,该元素恢复可见。

我想我遗漏了一些东西, …

html css animation svg

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