Shulou(Shulou.com)06/02 Report--

This article mainly introduces "how to insert colored lines in Dreamweaver". In daily operation, I believe many people have doubts about how to insert colored lines in Dreamweaver. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer the questions of "how to insert colored lines in Dreamweaver". Next, please follow the editor to study!

In dreamweaver, if you insert a Horizontal Rule (horizontal line), the line is only gray by default, which in many cases does not meet our requirements. What if you want to insert lines of other colors (or even as thin as a pixel)?

First, insert Horizontal Rule in the appropriate place in the document window (web page editing window)

Press ctrl + F3 to call up Property inspector (property panel)

In this property panel, uncheck the box before shading (shadow). Enter a pixel value (pixels) or percentage in W to set the length of the line. In H, enter 1 to make the line very thin, down to one pixel. If you want a thick line, you can enter a larger value in H. In this way, the thin line is plugged in, but you will find that the line is gray and the color cannot be set in the properties panel. If you want to set a different color, you can control it through css. You can easily set up css in DreamWeaver, and you don't even need to know the syntax of css at all.

Select CSS style under the Text menu | New Style

In the New Style dialog box, enter a name, such as colorline, in the name column, select This document only in the Define radio box, and then click ok. The Style definition for .colorline dialog box pops up:

In the type project, select the color you want, such as red, then click ok, then click done, and a new style is built. Select the thin line in the web editing window, click Text | CSS style | colorline (colorline is the new style just established). In the web editing window, the color of the line is still gray, but press F12 preview, you can see in the browser that the color of the inserted thin line has become the red you want.

There is another way to insert colored lines, even as thin as a pixel. First insert a row-by-column table in the page editing window, and then insert a transparent image of 1pixel × 1Pixel in this table. (the spacer image used to control page layout in dreameaver4 is exactly such an image, so if you don't know how to make such an image in software, you can generate it in dreameaver4:

Object panel first click layout view (layout view) in the View of Objiect panel, then click draw layout table, drag in the web editing window to generate a layout table (layout table), click Add spacer image in the drop-down menu of the table header

Create and save the spacer image, which is a transparent image of 1 pixel by 1 pixel). Then the properties of the table are set to: h (height) is 1 pixel (1 pixel), W (width) is the desired width (you can enter pixel values or percentages), cellpad, cellspace, border all enter 0, then select the desired color in Bg Color (background color), and the horizontal thin line with color is inserted.

If you increase the H value, then the line will get thicker. If you want to insert a colored vertical thin line, set H to the desired height value, W set to 0, and other settings are the same as above, you can insert the vertical thin line. In the web editing window, the color is still gray, but press F12 preview and you can see in the browser that the color of the inserted thin line has changed to the color you want.

At this point, the study on "how to insert colored lines in Dreamweaver" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.