這是我的目標。帶有透明度的傾斜標籤位於另一個頂部。我如何建立這個沒有使用jpg或PNG,但只有CSS?如何使用jquery和css3製作角度標籤界面?
回答
這TUTS將讓你去,但我會盡力在一分鐘內實體模型的東西!
http://www.howtocreate.co.uk/tutorials/css/slopes
http://net.tutsplus.com/articles/news/fun-with-css-shapes/
BTW很好的問題!
編輯:
這裏是 「最後」 的結果:
看到它here!
注:
要知道,這是一個「黑客」,它可能不是最好的主意,實際上實現它,我覺得(現在不能嘗試一下),即有此一些問題如果你問可用性和可訪問,我會說去與圖像:)
'border-right'應該是'#fff' :) – Dutchie432 2010-12-17 22:01:46
這很酷,但是如果我希望在像我的圖像這樣的標籤周圍添加一個固定筆畫呢?如果傾斜標籤已經是邊界,會不會很難? – WillingLearner 2010-12-17 22:03:33
@WillingLearner讓我看看..可以! – Trufa 2010-12-17 22:06:54
我對這個問題採取是使用CSS創建角度: http://www.howtocreate.co.uk/tutorials/css/slopes 或 http://www.dinnermint.org/blog/css/creating-triangles-in-css/
創建的「結束」作爲白色/ bl的角度的一片標籤ack,然後使用jQuery來應用透明度和選擇。
這應該可以幫助您在沒有圖像的情況下啓動。
它是否必須與CSS,或者你只是希望不使用光柵圖像?例如,您可以使用SVG背景圖像,該圖像可能比柵格圖像小,文件大小會更好。如果您擔心HTTP請求,則可以使用數據URI。如果你不想使用背景圖像,你也可以使用SVG或PNG作爲邊框圖像。
- 1. 如何使工作WordPress的wp_nav_menu與jquery用戶界面標籤
- 2. 下面的角度用戶界面引導標籤
- 3. 如何使用jquery在DIV標籤內製作圓角框?
- 4. 如何用CSS3製作三角形?
- 5. 如何在標籤和值相同的角度使用ng-options
- 6. 用角材製作圖標標籤?
- 7. 如何用jQuery製作CSS3動畫?
- 8. 角度用戶界面路由器 - 如何使參數需要
- 9. 與CSS3繪製45度角度
- 10. 用css3和jQuery製作縮放圓
- 11. 含量JQuery用戶界面被更新,而不是標籤2和標籤3
- 12. 如何使用jquery製作角色選擇頁面?
- 13. 如何使用django-tagging製作標籤?
- 14. 如何使用jQueryUI製作子標籤?
- 15. 標記標籤式界面
- 16. 角度路由不能使用標籤
- 17. 我如何製作此用戶界面?
- 18. 使JQuery用戶界面,標籤看起來像按鈕
- 19. 如何使用哈希標籤製作頁面Href刷新
- 20. 如何在IE6-8中使用HTML5標籤和css3?
- 21. 如何使用Bootstrap的標籤和jQuery Mobile的頁面?
- 22. 如何使用jQuery製作一個簡單的標籤?
- 23. 如何使用CSS3製作內邊框?
- 24. 如何使用css3製作動畫
- 25. 角度/用戶界面ip地址
- 26. 使用MySQL和PHP製作標籤雲
- 27. jQuery用戶界面標籤:如何在標籤調用父頁面的函數從外部URL
- 28. iphone界面形式和標籤
- 29. 非角度替代「移動角度用戶界面」
- 30. 獲得打開的標籤標題jquery easy用戶界面
會圓角嗎?或者他們需要傾斜 – 2010-12-17 21:46:51
這很難用CSS來完成。當然,您可以使用JavaScript做一些瘋狂的事情,但絕對不值得您從使用圖像時節省的時間。 – Jason 2010-12-17 21:52:21