html中hr的各種樣式使用

admin 建站教程評論8321字數(shù) 684閱讀模式
摘要

網(wǎng)頁設(shè)計當中hr的各種樣式,如果使用得當,將會給你的頁面增色很多,下面就來詳細介紹下各種樣式和各種使用方式的方法!

我用的編輯器是eclipse,這個根據(jù)個人喜好來定,用什么都無所謂的,就算你直接用txt也照樣能實現(xiàn)這里的效果,畢竟只是靜態(tài)。
html中hr的各種樣式使用

第一種:

  1. <hr style=" height:2px;border:none;border-top:2px dotted #185598;" />  
  2.   
  3. height:2px;是hr的高度  
  4.   
  5. border:none;是沒有邊框  
  6.   
  7. border-top:2px dotted #185598;是設(shè)置橫線的樣式  
  8.   
  9. dotted  虛線  #185598  顏色  

html中hr的各種樣式使用

第二種:

  1. <hr style="height:1px;border:none;border-top:1px dashed #0066CC;" />  

html中hr的各種樣式使用

第三種:

  1. <hr style="height:1px;border:none;border-top:1px solid #555555;" />  

html中hr的各種樣式使用

第四種:

  1. <hr style="height:3px;border:none;border-top:3px double red;" />  

第五種:

  1. <hr style="height:5px;border:none;border-top:5px ridge green;" />  

第六種:

  1. <hr style="height:10px;border:none;border-top:10px groove skyblue;" />  

border-top:10px groove skyblue; groove 上顏色 skyblue 下顏色


只要hr樣式用的好,會讓你的網(wǎng)頁活靈活現(xiàn)的哦!

版權(quán)聲明:文章圖片資源來源于網(wǎng)絡(luò),如有侵權(quán),請留言刪除!!!
廣告也精彩
admin
  • 本文由 發(fā)表于 2020年11月24日 14:58:01
  • 轉(zhuǎn)載請務(wù)必保留本文鏈接:http://yudch.cn/6763.html
匿名

發(fā)表評論

匿名網(wǎng)友 填寫信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: