11/5/2023 0 Comments Dreamweaver htmlTo complete the code for the text box and to create a text box illusion, borders need to be added to both sides of the text box content. The images now form a box around the text content inside of the text box between the top image and the bottom image. The selector for the h3 title tag has the image called ‘box.jpg’ attached as a background image and is positioned at zero for the X axis and zero for the Y axis. * The paragraph tag contains the side borders mark-up */īackground: #ffffff none repeat scroll 0 0 * this is the title h3 tag and contains the backgroundīackground: url(./images/box.jpg) repeat scroll 0 0 There is a 10 pixel margin set to the bottom of the ‘box’ div which will push any other web text box away from it too.īackground: url(./images/boxBottom.jpg) īackground-attachment: scroll left bottom There are 15 pixels of padding set to the bottom of the ‘box’ div which will push any content away from the image for a nice fit of your html text box and to keep your html box text from seeping out from the bottom. The width of the image matches the html text boxes’ width. The container class div called ‘box’ has the ‘boxBottom.jpg’ image attached to it and is positioned to the bottom of the div and as far left as possible. It's now time to copy and paste the CSS for the Web Text Boxes into our CSS File. We then use CSS to style the borders of the html box text and create the illusion that the text is fully contained inside of a web text box. The other image is a background image for the title which is attached using css to the h3 selector. The 'box' div is the container div which is wrapped around the title and paragraph tags. The html text box consists of a class div called ‘box’, and at the bottom of the div is placed a background image attached using css. That the web text box will expand with the content This is some sample text which you can use to see
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |