背景と罫線を組み合わせたい

https://blogs.yahoo.co.jp/IMG/ybi/1/cb/66/suzutakaho/folder/194827/img_194827_21118690_1?1135488276
背景と罫線を組み合わせたいとリクエストがありましたのでちょっと工夫してみました。


border-bottom:dashed 2px #ff6600の場合
border-bottom:dashed 1px #ff6600の場合
border-bottom:solid 1px #ff6600の場合

||||<#ffffaa'style='width:560;border-bottom:dashed 2px #ff6600;color:#009900;font:bold 14px'``border-bottom:dashed 2px #ff6600の場合||
||||<#ffffaa'style='width:560;border-bottom:dashed 1px #ff6600;color:#009900;font:bold 14px'``border-bottom:dashed 1px #ff6600の場合||
||<#ffffaa'style='width:560;border-bottom:solid 1px #ff6600;color:#009900;font:bold 14px'``border-bottom:solid 1px #ff6600の場合||

●「||」を2本にすると頭揃えです。
●「solid」で実線です。
●1行ずつしかできませんので注意してください。



border-bottom:dashed 2px #000000の場合
border-bottom:dashed 2px #000000の場合
border-bottom:dashed 2px #000000の場合
border-bottom:dashed 1px #000000の場合
border-bottom:dashed 1px #000000の場合

||||<#ffffff'style='background-image:url(http//~) ;width:560;border-bottom:dashed 1px #ff9933;color:#000000;font:bold 14px'``border-bottom:dashed 1px #000000の場合||
||||<#ffffff'style='background-image:url(http://~) ;width:560;border-bottom:solid 2px #ff9933;color:#000000;font:bold 14px'``border-bottom:solid 1px #000000の場合||

●url(http://~)の「:」は変更する度に「&#58」に置き換えてください。メモ帳にコピーしておくと良いでしょう。
実線は「solid」です。
画像は非公開の記事か書庫にアップして下さい。
この方法では1行ずつで背景も繰り返ししか出来ません。
全体に背景入れたい場合は今の所、背景画像に罫線を書いてやるしか思いつきません。

text-decoration:underline でアンダーラインです。ちょと罫線には見えません。アジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合うアジサイを描いてみました。うまくないですがこの記事に合う

||<#ffffff'style='width:560;height:250;background-image:url(http&#58//~);right bottom no-repeat;color:#00dd00;font:bold 20px;text-decoration:underline;color:#000000'``''' text-decoration:underline '''||

●text-decoration:underlineでアンダーラインです。