首先看看怎麼實現的貼上**;
>
lang
="en"
>
charset
="utf-8"
>
>
title
>
>
.sjx
style
>
head
>
>
class
="sjx"
>
div>
body
>
html
>
主要**就是style中的border樣式。首先寬高設為0，border-width就是三角形的高度，border-color（上，右，下，左）這裡把前三個設定為透明，第四個設定為紅色，所以三角形方向是向右的。
為了方便理解，這裡把border-color四個顏色都設定出來看看
這裡可以這麼理解:由於div寬高設定為0，而邊框為40px就會出現乙個80*80的正方形，上下左右平分則是四個三角形。但如果不設定下邊框而設定其他三個邊框則會如下圖：
從這裡可以看出沒了下邊框就變成了40*80的長方形，所以實質上這個正方形還是4個40*80的矩形拼成的。
但是如果只設定左右，或者上下的邊框則什麼也沒有，因為div長寬都為0，則顯示不出來，這裡之所以會顯示是因為上下和左右至少各有乙個，會互相賦值，比如上邊框高度為40px由於沒有寬度則不顯示，此時如果設定乙個左邊框會把左邊框的高40px賦值給上邊框的框則會顯示出來。
CSS 關於css中的border
曾經一直以為html中的border是直角的，直到有一天 test效果如下 突然有一種被欺騙了的感覺。我們可以選擇理解乙個border為兩個三角形再加乙個矩形。如上所示。繪製小尾巴 當對乙個角應用圓角樣式，如果這個角相鄰的兩個border乙個有定義而乙個無定義，那麼繪製的結果就是由粗到細的 小尾巴了...
css中的border屬性。。。。。
1.border color 邊框的顏色 一般設定邊框都有3個屬性 寬度 線的樣式 顏色，如果寬度設定了很多px，那麼就可以給邊框設定很多顏色，讓邊框顯示出漸變的效果，不過設定邊框不同顏色時只能通過border bottom colors，border top colors，border left ...
css中的有趣的 border
css 中的 border 屬性，我想凡是了解一點 css 的都知道它是作用，可以在 mdn 上找到對它的詳細介紹。簡單來說，就是我們常用的邊框，乙個非常基礎的用法，就是 border 1px solid black 等價於 border width 1px border style solid b...