创建CSS

倾斜的边界，我想创建这样http://www.tiikoni.com/tis/view/?id=0ea293a（红色线）与倾斜的边界线创建CSS

如何与CSS-CSS3或JS使这个？

<div id="DIV_1"> 
    <img src="/uploads/2016/01/logo.jpg" width="250px" id="IMG_2" alt='' /> 
    <nav id="NAV_3"> 

     <button id="BUTTON_4"> 
      Primary Menu 
     </button> 
     <div id="DIV_5"> 
      <ul id="UL_6"> 
       <li id="LI_7"> 
        <a href="/lcvb/" id="A_8">Home</a> 
       </li> 
       <li id="LI_9"> 
        <a href="#" id="A_10">about</a> 
       </li> 
       <li id="LI_11"> 
        <a href="#" id="A_12">location</a> 
       </li> 
       <li id="LI_13"> 
        <a href="#" id="A_14">service & quality</a> 
       </li> 
       <li id="LI_15"> 
        <a href="#" id="A_16">Contact</a> 
       </li> 
      </ul> 
     </div> 
    </nav> 
</div>

来源

2016-01-22 SURTLER77

只有一些tipps：使用'：before'和/或'：after'伪元素，'border'和'transform：rotate（）'。 –

@Linus考德威尔，你能告诉我一个例子，我不明白 – SURTLER77

@ SURTLER77：我只看到一个倾斜的边界，而不是曲线。那是你曲线的意思吗？如果是的话，看看这一个-http：//stackoverflow.com/questions/29982414/drawing-angled-lines-in-css/29982491#29982491 – Harry

最简单的方法是在logo上使用:: after。然后安排旋转和定位，以及一个红色边框。一旦你到响应......应该做的伎俩也很容易“显示无”吧。当然，这取决于你需要的浏览器支持。

来源

2016-01-22 16:55:39

回答

相关问题