Re: [css4-background] use cases for 'border-corner-shape'?

About Border Triangle:
Through the border-corner-shape can indeed achieve a triangle:

border-corner-shape: bevel;
border-radius: 50% / 50% 0 0 50%;
width: 180px;
height: 60px;

But that's not what I want, I want to pass a new property to achieve this
effect (looks like the corners and the interior is a whole, rather than go
through the hack splicing methods.):
http://img01.taobaocdn.com/tps/i1/T1jHq3XrpdXXck28I0-660-752.png

I do not know @fantasai there is no good idea?


以上
一丝


2013/6/6 一丝 <yiorsi@gmail.com>

> Dear Lea Verou:
> I have friends and W3C China confirmed over the year, Test the Web Forward
> China has two stations, respectively, in Shanghai and Shenzhen. How about?
> To China play it? I miss you!
>
>
> 以上
> 一丝
>
>
> 2013/6/5 Lea Verou <lea@w3.org>
>
>> Hi 一丝,
>>
>> I've thought about that too, but I'm afraid I can't think of any
>> sufficiently generic way of solving this problem.
>> However, border-corner-shape will make it much easier, you won't need to
>> bother with all the border hacks, as we'll be able to do triangles natively.
>>
>> Cheers,
>> Lea
>>
>>  Lea Verou
>> W3C developer relations
>> http://w3.org/people/all#lea ✿ http://lea.verou.me ✿ @leaverou
>>
>>
>>
>>
>>
>>
>> On Jun 5, 2013, at 01:15, 一丝 <yiorsi@gmail.com> wrote:
>>
>> Dear Lea Verou:
>>
>> Thank you very much for such a quick reply to me.
>>
>> About drop-shadow () filter I have no problem. This is precisely the lack
>> of resolve box-shadow, right?
>>
>> I actually crucial question has nothing to do with shadows:
>> CSS4-background in since you can add "border-corner-shape" attribute to
>> achieve a more extensive border, so my idea is whether you can add an
>> attribute with an element does not use pseudo-elements to achieve the above
>> example does this little triangle ?
>>
>> Similar: border-left-shape: triangle (left border is a triangle, and then
>> through other attributes control this location)
>>
>> PS: I am currently taobao.com front-end engineers, very much like CSS.
>> Last year I participated in the "Test the Web Forward" (
>> http://testthewebforward.org/beijing-2012.html), I hope you can come to
>> China this year to do the exchange and sharing. In China, many people want
>> to participate in specification, but there is no good guidance and
>> atmosphere.
>>
>>
>> 以上
>> 一丝
>>
>>
>> 2013/6/5 Lea Verou <lea@w3.org>
>>
>>> Hi 丝,
>>>
>>> This is exactly what the drop-shadow() filter is for. What do you have
>>> against it? If it's the browser support, keep in mind anything we add to
>>> the spec now, will likely have worse browser support as it will be newer.
>>>
>>> Thanks for the praise about my border-radius talk :)
>>>
>>> Cheers,
>>> Lea
>>>
>>>  Lea Verou
>>> W3C developer relations
>>> http://w3.org/people/all#lea ✿ http://lea.verou.me ✿ @leaverou
>>>
>>>
>>>
>>>
>>>
>>>
>>> On Jun 5, 2013, at 00:01, 一丝 <yiorsi@gmail.com> wrote:
>>>
>>> @Lea Verou
>>>
>>> In fact, I am more concerned about how to use the border or other
>>> attributes to achieve this effect: http://dabblet.com/gist/3820382
>>> 1. can have a better box-shadow effect (do not use the filter:
>>> drop-shadow)
>>> 2. do not use the pseudo-elements
>>>
>>> PS: You on the border-radius of the ppt is really cute. With Chinese
>>> speaking call: 萌, Japanese called:かわいい.
>>>
>>>
>>> 以上
>>> 一丝
>>>
>>>
>>> 2013/6/5 Lea Verou <lea@w3.org>
>>>
>>>> I came across a gorgeous use case today for both the bevel (in multiple
>>>> places) and the scoop values: http://www.losttype.com/klinic/?s=eee
>>>>
>>>> Lea Verou
>>>> W3C developer relations
>>>> http://w3.org/people/all#lea ✿ http://lea.verou.me ✿ @leaverou
>>>>
>>>>
>>>>
>>>>
>>>>
>>>>
>>>> On Mar 26, 2013, at 14:18, fantasai <fantasai.lists@inkedblade.net>
>>>> wrote:
>>>>
>>>> > On 03/24/2013 03:50 PM, Lea Verou wrote:
>>>> >> I’ll try to find some additional good examples.
>>>> >>
>>>> >> Elika, since you added the property, maybe you had some good
>>>> existing use cases in mind?
>>>> >
>>>> > The major one for 'bevel' was to allow the shapes that are used in
>>>> certain
>>>> > kinds of breadcrumb trails and tabs: some styles uses slanted tabs
>>>> rather
>>>> > than curved-corner ones, and I've seen breadcrumb trails that look
>>>> like
>>>> >  ____________________
>>>> > |     \       \       \
>>>> > |______\_______\_______\
>>>> >
>>>> > or
>>>> >   ____________________
>>>> >  | ... \  ... \  ...  \
>>>> >  |_____/______/_______/
>>>> >
>>>> > (Earlier designs of the Launchpad bug tracker did this, for example.)
>>>> >
>>>> > Another use case was to give shapes that would commonly allow the
>>>> hit-testing
>>>> > (and background-painting) area to more closely approximate
>>>> fancy-cornered
>>>> > border images.
>>>> >
>>>> > ~fantasai
>>>> >
>>>>
>>>>
>>>>
>>>
>>>
>>
>>
>