問題:如何通過div+css以及定位來實現(xiàn)圓角矩形?
解決方法概述:
內容:首先在<body>標簽內部里添加一個大層(大層用來固定整體大框架),然后大層內包含四個小層(四個小層里分別放四個圓角(事先用ps做好橢圓形形狀,然后用切片工具切圖 ))
樣式:在<head>標簽內部設置的css要有的屬性:
1.position:relative;
2.寬和高;
3背景顏色;
4.邊框線(用來調整四個原角的相對位置,調整好后可以將邊框線設置刪除)
在設置小層的css時,每個層里都要有的屬性有:
1.position:absolute;
2.寬和高;
3.方向屬性(left,right,bottom,top)
4.background:url("")no-repeat;(引入各個方向的圓角圖片)
以下是我實現(xiàn)圓角矩形的代碼:
注意:我的代碼里用的css樣式是內聯(lián)式,CSS樣式有三種:內聯(lián)式,嵌入式,外部式。
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
原文鏈接:http://www.cnblogs.com/cyn941105/p/5588940.html