### css圓角
1. 圓角有4個值,一般情況下,設置一個值表示4個角都是一樣的圓角。。
2. 如果4個都有值,則表示從上左角開始
~~~
html:
<div class="demo"></div>
css
.demo {
width: 150px;
height: 80px;
border: 2px solid #f36;
background: #ccc;
border-radius: 10px 15px 20px 30px;
}
~~~
效果:

****
### 漸變
1.簡單的使用:顏色從上到下漸變
~~~
html:
<div class="demo"></div>
css:
.demo {
width: 100px;
height: 50px;
background: linear-gradient(to bottom , #ccc , #000)
}
~~~
效果:

2. 設置顏色漸變的角度
~~~
.demo {
background: linear-gradient(0deg, #ccc, #000)
}
~~~
表示從下到上,角度沿著順時針轉動。。
比如:
~~~
.demo {
background: linear-gradient( 90deg, #ccc, #000)
}
/*相當于*/
.demo {
background: linear-gradient ( to bottom right, #ccc, #000)
}
~~~
3. 設置多個漸變色,顏色可以設置多個漸變色,具體只需添加顏色即可,不多描述
- 空白目錄
- Javascript
- angularjs
- 自定義指令
- scope
- 自定義指令的封裝
- 自定義指令限制只能輸入數字
- 輪播圖
- 寫angular的順序
- $state
- video
- Es6
- Let
- 箭頭函數
- export
- promise
- 函數
- vue
- vue安裝,以及項目結構
- vue的使用
- easy-vue
- vue起步
- vue基礎
- vue-router
- vue-各文件的依賴關系
- vuex
- vue使用sass語法
- mpvue使用wx.parse
- vue-cli 構建vue項目
- vant的使用
- vue使用插件及常見問題
- 原生Js
- 數組
- ajax
- 執行上下文
- 正則表達式
- jqurey
- jqurey-mobile
- html5
- 工具
- svn使用總結
- webpack
- webpack的構建
- WebStorm
- 切圖相關
- 蘋果手機注意事項
- other
- 前端的價值
- 面試相關
- css
- 小程序如何引用外部字體
- 流的理解
- 替換元素
- content和偽元素
- padding和background 繪制圖形
- css圓角,陰影,漸變
- line-height verticle-align
- 使用background繪制4個直角
- android的字體偏上的問題
- 小程序
- 小程序常見問題
- 小程序常用效果
- mpvue
- nodejs
- 前端工程化學習筆記
- mork.js學習