1、形成如下效果：文字居於框中
（一般給span標籤加框框，會比較貼合緊密，不好看）
font-size: 1.3rem;
border: 1px solid #337ab7;
padding: 0 10px;
height: 20px;
line-height: 20px;
加高之後，其實上下內邊距再加高就不好看了，所以適當加左右邊距，會好看一點。
2、文字左邊有豎線
box-shadow: -4px 0px #3577ef;第乙個代表x軸上，第二個代表y軸上，第****擴散，第四個代表擴散速度 ，第五個為盒子顏色。數值為負，則代表左邊或者下班，三四屬性值大於等於0.
box-shadow: -4px 3px 5px 2px black;
box-shadow: inset -4px 3px 5px 2px black;（inset）
一般為border-radius：5px；之類的
但這種情況：border-radius:0 12px 0 12px;(左上，右上，右下，左下)
4、span標籤中間加「 | 」
span:last-of-type::after 這個為重點，即最後乙個span標籤後面的樣式為，
下面的權重大於上面的，所以會覆蓋掉已有的 |
5、漸變式背景
6、垂直輪播文字
前端小技巧 一
css常用的一些設定小技巧 幾乎經常用到 一 特殊情況下position的定義 比如這個例子，背景是張，輸入框，提交按鈕 以及下邊的六個按鈕的單擊事件都是固定在之上的。圖1 圖2 設定技巧 1 背景用的是background url 鏈結的 2 將背景設定position relative 背景之上...
前端實戰小技巧
前端知識小技巧 1 保留 首行 標題 清空列表 table tr not first html table tr not first empty 2 通過屬性隱藏input標籤型別 隱藏，但會佔位置 隱藏，但不會佔位置 通過jquery隱藏與顯示 p hide p show 3 前台動態新增opti...
前端布局 小技巧
這種方式最好應用於 按鈕 文字之類的居中模式，否則就需要借助inline block來進行居中布局。適用於塊級元素不給出寬高的情況下 需要借助transtrom的tanslatex方法 parent child 適用於塊級元素知道寬度 parent child 子元素寬度已知的情況下 parent ...