㈠ 有那位高人知道網頁里DIV+CSS中正方形的圖片里其中兩個對角想把它改成圓角,在CSS中應該怎麼寫
可以的
.box {
width: 300px;
background-color: #ccc;
-moz-border-radius: 10px;
border-radius: 10px;
} 試試這個
㈡ 怎麼用PS做出圓角矩形菜單,用於網頁的
ps工具中選擇矩形工具內的「圓角矩形工具」,在上面的屬性工具欄中,設置為路徑模式,設置圓角的半徑大小,畫出圓角矩形路徑後,按CTRL+ENTER組合鍵轉化為圓角矩形選區,後面的操作應該就知道怎麼做了
㈢ web前端滑鼠放在div標簽製成的盒子上如何實現圖片一秒內由正方形變為圓形在變
原本不是圓形圖片,通過CSS樣式布局實現成圓形圖片,首先圖片必須為正方形
1、HTML源代碼完整代碼:
復制代碼代碼如下:
圖片圓形布局 在線演示 DIVCSS5。
2、對應CSS代碼:
復制代碼代碼如下:
#divcss5{ margin:10px auto}。
#divcss5 img{ border-radius:50%}。
命名盒子「id=divcss5」盒子居中,同時上下外間距為10px;,然後設置對象盒子里img圖片圓角50%。
㈣ PS批量處理,想要把照片批量設置成圓角,但是保存下來依然是矩形(PNG格式)
先用acdsee全轉化成png格式
然後在PS里,新建動作開始錄制
雙擊背景圖層解鎖→全選(ctrl+a)→選擇→平滑(輸入你要的圓角半徑大小)→反選→按del刪掉四角→取消選擇→保存,關閉(這個很重要,不然你等下就要處理一個手動關一個了)
然後點停止錄制
然後把所有這一批圖片拖進ps里
選擇那個動作使勁點播放的按鈕就行了
㈤ 求助,用PS如何將圖片直角邊改成圓角
先用ps打開圖片,雙擊圖層面板上的背景圖層解鎖 然後用圓角矩形工具,以路徑模式畫出路徑(後面的半徑可以調節圓角的弧度) ctrl+enter吧路徑轉為選區,shift+ctrl+i 反選,del清除多餘部分就可以了 保存方法: 方法1、你可以另存為png格式的,那麼圓角以外的部分是透明的了 方法2、菜單欄-文件-存儲為web所用格式,選gif格式,並且勾選透明度就可以了……
㈥ 用PS怎麼把圖片的四個直角變成圓角,並且不漏白
直接用這個在線圖片轉圓角圖片的工具吧,直接設置一下圓角的數值,馬上就能出結果,非常好用。還能單獨設置圖片四個角是否需要變成圓角。圖片背景是透明的,沒有白邊,正好符合你要求。在線生成圓角圖片,PNG|JPG圖片轉圓角
▼ 生成圓角圖片工具使用步驟:
一、首先選定一張照片,通過改變圓角大小的數值,下方會顯示照片轉換效果的實時預覽,默認生成的圓角為60px。
二、可以通過多選框單獨選擇圖片需要被轉換成圓角的角,默認是圖片的四個角都會被轉換成圓角。
三、圖片預覽顯示的是轉換後的縮略圖,而下載時候是轉換生成的原始大小和原始清晰度的圖片。
四、因為jpg等格式的圖片不支持透明背景,所以如果選定的照片原始格式為jpg等,會自動將照片轉換為png格式,那麼在下載時png照片佔用的存儲空間可能會顯著增大。
五、如果圓角設置過大,可能會造成不可預計的轉換結果,應當在合理范圍內設置圖片圓角的大小。
㈦ web前端開發,怎麼處理css3中邊框倒角屬性
CSS3 使用border-radius屬性設置圓角效果
該屬性可以通過設置圖片或塊級元素四個角的圓角半徑像素數來實現該效果。W3C規定該屬性的可能取值為:
none,默認值,表示元素沒有圓角效果
length,由浮點數字和單位標識組成的長度值
%,由百分比設置的圓角值
該屬性可以分別設置元素的四個圓角效果,採用下列格式來實現。
格式:border-radius: 左上角 右上角 右下角 左下角;
通常,四個方向的角半徑均採用length取值來實現,該取值必須為浮點數字和單位標識共同組成。同時規定,該取值不得取負數。
例1:利用整數來實現圓角取值。
div{
width: 200px; height: 150px;
border: solid 1px #aaaaaa;
border-radius: 10px 5px 10px 5px;
background-color: #ff5857;
}
上述實例設置了一個div塊級元素,其寬度為200px,高度為150px。為了能夠看到其圓角效果,增加了顏色為#ff5857的背景顏色,並且添加了1px大小的邊框,其邊框為實線,邊框顏色為#aaaaaa。最後設置其圓角效果,左上角和右下角均為10px,右上角和左下角均為5px。
例2:查看下列CSS代碼。
(1)border-radius: 10px 5px 15px 20px;
(2)border-radius: 10px 5px 15px;
(3)border-radius: 10px 5px;
(4)border-radius: 10px;
上述四組代碼中,只有組(1)提供了完全符合格式的四個數據,其他三組均只提供了小於四個的數據。這種情況下,數據依然按照「左上角 右上角 右下角 左下角」的順序進行排列,沒有涉及到的角方向按照其對角的圓角數據進行設置。
因此,組(2)的數據表示:左上角為10px,右上角為5px,右下角為15像素,左下角為右上角的像素設置,即5px。請同學們根據這樣的方法,理解一下組(3)的圓角含義。
組(4)就設置了一個數據,這表示四個方向的角半徑均為10px。
二、獨立設置元素的四個圓角效果:
若只想設置一個塊級元素右上角的圓角效果,該如何實現呢?這里W3C為border-radius屬性派生出了表示四個方向的獨立圓角效果的子屬性。
border-top-left-radius, 定義左上角的圓角效果
border-top-right-radius, 定義右上角的圓角效果
border-bottom-right-radius, 定義右下角的圓角效果
border-bottom-left-radius, 定義左下角的圓角效果
上述四個子屬性的取值規則和border-radius屬性的取值規則是完全相同的。
例3:設置p標記的圓角效果,其中左下角沒有圓角效果,其他三個方向角的圓角效果均為25px。
方法1:利用border-radius屬性統一設置。
p{border-radius: 25px 25px 25px 0;}
方法2:利用border-radius屬性的派生子屬性設置。
p{
border-top-left-radius: 25px;
border-top-right-radius: 25px;
border-bottom-right-radius: 25px;
}
方法3:利用border-radius屬性設置所有角方向均為25px,再利用border-radius屬性的派生子屬性設置左下角沒有圓角效果。
p{
border-radius: 25px;
border-bottom-left-radius: none;
}
㈧ 網頁設計中,怎麼讓DIV的邊框的4個角呈圓角形
怎麼能讓一個DIV或者一個圖片的四角為圓形呢?其實並不需要我們去把每個角都剪切掉,而只需要設置每個解的圓狐度即可。
案例代碼:
div{border-radius:5px5px00;}設置DIV對象盒子左上角和右上角5px圓角,其它兩個角為0不圓角
border-radius:3px 4px 5px 6px代表設置對象左上角3px圓角、右上角4px圓角、右下角5px圓角、左下角6px圓角.box2img{border-radius:5px}
設置DIV中的圖片為圓角圖片。
㈨ 怎樣用ps使圖片邊角變圓滑
用PS使圖片邊角變圓滑,可以用選擇工具羽化,形成R角後,再反選,刪除R角部分,具體操作方法如下:
㈩ 用PS怎麼把照片做成圓角的必須是後面不用填充背景色的
用圓角矩形選框工具
在圖上畫一個圓角的矩形
轉換成選區
然後反選
delete或者填充白色就可以了
就是這么簡單啊