Heim > Web-Frontend > HTML-Tutorial > div+css+html学习笔记(1)_html/css_WEB-ITnose

div+css+html学习笔记(1)_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:32:00
Original
980 Leute haben es durchsucht

1. 导入外部css:

<link rel="stylesheet" type="text/css" href="skin/css/index.css">
Nach dem Login kopieren

2. 横排div

#search {    width: 10%;float: left;}
Nach dem Login kopieren

float: left; 这个属性让search往左浮动,这样它的后面(右边)就可以放置别的元素。

3.两个div连在一起,不留空隙

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

4. div外边框
border: 1px solid #ccc;

5. 虚线


6. img标签 alt的作用,例:

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

当src里面的图片因为网上太慢,或者路径错误,或者其他原因导致图片显示不了时,就会用alt里面的文字说明代替。

 

 ps:宽度用实际像素,不管你的浏览器窗口有多大,都会显示原来的大小,这样图片不易变形。如果用百分比,他是占父布局的比分几,大小与会随浏览窗口的大小变化。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage