小编Jac*_*unt的帖子

我正在设计一个网页的标题.我希望标题是一行,其中包括徽标和一些导航链接.我觉得今天布局这个标题的最好,最现代的方法是使用CSS3的flexbox,所以这就是我想要使用的.

我希望徽标尽可能远离Flex容器,其余的导航项尽可能最右边.这可以通过左右浮动元素轻松实现,但这不是我想要做的.所以...

如何将flexbox容器的子元素与主轴的相对远端对齐？

flexbox子元素有一个属性,允许您在十字轴上执行此操作align-self,但似乎没有在主轴上执行此操作.

我想出来实现这一目标的最好方法是在徽标和导航链接之间插入一个额外的空元素作为间隔符.但是我选择将flexbox用于此标题的部分原因是为了与响应式设计保持一致,并且我不知道如何使间距元素占用所有剩余空间,而不管观察窗口的宽度如何.

这是我目前对标记的立场,简化为仅包括与此情况相关的元素.

HTML

<ul>
  <!-- Should be as far left as possible -->
  <li id="main">Some Logo <span>Some tag line.</span></li>

  <!-- Should be as far right as possible -->
  <li>Home</li>
  <li>Products</li>
  <li>Price Sheet</li>
  <li>Capabilities</li>
  <li>Contact</li>
</ul>

CSS

ul {
  width:           100%; 
  display:         flex;
  flex-flow:       row nowrap;
  justify-content: flex-end;
  align-items:     center;

  padding:    0;
  margin:     0;

  list-style: none;
}

li {
  margin:     0 8px;
  padding:    8px;

  font-size:   1rem;
  text-align:  center;
  font-weight: bold;

  color:       white;
  background:  green;
  border: …

我想使用正则表达式来验证用户输入.我想允许字母,数字,空格,逗号,撇号,句号,感叹号和问号的任意组合,但我还想将输入限制为4000个字符.我想出了以下正则表达式来实现这一点:/^([a-z]|[0-9]| |,|'|\.|!|\?){1,4000}$/i.

但是,当我尝试使用这个正则表达式在PHP中使用preg_match()测试一个主题时,我会收到一个警告:PHP Warning: preg_match(): Compilation failed: regular expression is too large at offset 37并且主题无法测试.

我发现这很奇怪,因为如果我使用无限量词,测试通过就好了(我在下面演示了这种情况).

为什么将重复限制在4000个问题,但无限重复？

正则表达式-test.php的:

<?php

$infinite = "/^([a-z]|[0-9]| |,|'|\.|!|\?)*$/i";        // Allows infinite repetition
$fourk    = "/^([a-z]|[0-9]| |,|'|\.|!|\?){1,4000}$/i"; // Limits repetition to 4000

$string   = "I like apples.";

if ( preg_match($infinite, $string) ){

    echo "Passed infinite repetition. \n";
}

if ( preg_match($fourk, $string) ){

    echo "Passed maximum repetition of 4000. \n";
}

?>

回声:

Passed infinite repetition 
PHP Warning:  preg_match(): Compilation failed: regular …

为了构建我的JavaScript代码,我想使用类,ES6的新原型继承的语法糖.我遇到了麻烦:似乎我的原型方法没有按预期工作,这让我觉得我可能对JavaScript类有一个基本的误解,和/或它们是如何工作的.

采用以下代码,声明传统构造函数Cat并修改其原型,以及Dog在其中定义的原型方法的ES6类.

// Traditional Cat Constructor
// ===========================
function Cat(name) {
    this.name  = name;
    this.sound = "Meow.";
}

Cat.prototype.speak = function() {
    console.log(this.sound || "I don't make a sound.");
};


// Dog via ES6 Class
// =================
class Dog {
    constructor(name) {
        this.name = name;
        this.sound = "Woof!";
    }

    speak() {
        console.log(this.sound);
    }
}

var cat = new Cat("Bella");
var dog = new Dog("Sparky");

在NodeJS中(使用4.4.2和6.0.0-pre测试),当我尝试获取实例的原型时Dog,我得到一个空对象,但我仍然能够在实例上调用prototype方法.

Object.getPrototypeOf(cat);
// -> Cat { …