div css html study notes (1)_html/css_WEB-ITnose

1. Import external css:

<link rel="stylesheet" type="text/css" href="skin/css/index.css">

2. Horizontal div

#search {    width: 10%;float: left;}

float: left; This attribute makes search float to the left, so that other elements can be placed behind it (to the right).

3. Connect two divs together without leaving any gaps

#a { background: #ff0000; width: 70%;height: 20px; float: left;}#b { background: #ff0000; width: 30%; height: 20px; float: right; }

4. div outer border
border: 1px solid #ccc;

5. Dashed line

6. The role of img tag alt, for example:

<img alt="木有图片" src="skin/images/index/left_top.jpg">

When the image in src cannot be displayed because the Internet is too slow, or the path is wrong, or for other reasons, it will be replaced by the text description in alt.

ps: Use actual pixels for the width. No matter how big your browser window is, it will display the original size, so that the image is not easily deformed. If you use a percentage, it is the proportion of the parent layout, and the size will change with the size of the browsing window.