HTML CSS examples for CSS Widget:Border Style
Make a border wrap around a group of pictures
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .img1{<!--from w w w. ja v a 2 s .c om--> border-width:4px; border-style:solid; } .img2 { position:relative; margin-left: -90px; vertical-align:-5px; z-index:-1; border-width:4px; border-style:solid; } .img3{ position:relative; margin-left: -90px; vertical-align:-10px; z-index:-2; border-width:4px; border-style:solid; } .album { border-width:2px; border-style:solid; border-color:#78c9a9; display:inline-block; } #imgAlbum { height:150px; width:100px; } p { color:red; } </style> </head> <body> <title>Gallery Test</title> <link type="text/css" rel="stylesheet" href="CSS.css"> <div class="album"> <span> <img class="img1" id="imgAlbum" src="https://www.java2s.com/style/demo/Opera.png"> </span> <span> <img class="img2" id="imgAlbum" src="https://www.java2s.com/style/demo/Google-Chrome.png"> </span> <span> <img class="img3" id="imgAlbum" src="https://www.java2s.com/style/demo/Opera.png"> </span> </div> </body> </html>