Home > Web Front-end > HTML Tutorial > div css html study notes (1)_html/css_WEB-ITnose

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

WBOY
Release: 2016-06-24 12:32:00
Original
980 people have browsed it

1. Import external css:

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

2. Horizontal div

#search {    width: 10%;float: left;}
Copy after login

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; }
Copy after login

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">
Copy after login

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.

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template