HTML CSS examples for CSS Widget:Banner
Create ad banner
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .ads-w1 {<!--from ww w . j a v a 2s. c o m--> background: url("https://www.java2s.com/style/demo/Google-Chrome.png") 0px 0px repeat-x #3ec2c5; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px 5px 5px 5px; margin: 0px 0px 12px; } .ads-w2 { background: #fafafa; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; height: auto; display:table; } .ads_cost { float: left; font-size: 24px; color: #FFFFFF; text-shadow: 1px 1px 1px #525252; font-weight: bold; padding: 0px 0px 0px 0px; margin: 0px 20px 0px 0px; width: 120px; background-color: #00BF00; text-align: center; line-height: 54px; } .ads_info { float: left; width: 340px; overflow: hidden; } .ads_banner { float: left; text-align: center; width: 490px; overflow: hidden; margin: 8px; } .ads_info .title { font-size: 18px; color: #278dff; font-weight: bold; padding: 0px 0px 0px 0px; margin: 5px 0px 0px 0px; height: 20px; overflow: hidden; } </style> </head> <body> <div class="ads-w1"> <div class="ads-w2"> <div class="ads_cost"> <span>$0.01</span> </div> <div class="ads_info"> <div class="title"> Ads Title </div> </div> <div class="ads_banner"> Ads Banner </div> </div> </div> </body> </html>