简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Heim > Web-Frontend > HTML-Tutorial > Hauptteil

div css三列布局效果实例代码_html/css_WEB-ITnose

WBOY
Freigeben： 2016-06-24 11:31:10
Original
1688 Leute haben es durchsucht

div css三列布局效果实例代码:
三列布局在是比较中规中矩的布局之一，大量的网站都有应用，也是初学者必须要掌握的布局方式之一，下面就是一个三列布局的实例代码，仅供参考之用，希望对初学者有一定的帮助，代码实例如下:

 

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="author" content="http://www.softwhy.com/" /><title>三列布局效果代码实例</title><style type="text/css" >* {  padding:0px;  margin:0px;}body {  background-color:#e1ddd9;}h1 {  font-size:11px;  text-align:center;  color:#564b47;  background-color:#90897a;}strong{font-size:13px;}#left{  position:absolute;  left:0px;  width:190px;  color:#564b47;  margin:0px;  padding:0px;  height:500px;}#content {  margin:0px 190px 0px 190px;  border-left:2px solid #564b47;  border-right:2px solid #564b47;  padding:0px;  background-color:#ffffff;  height:500px;}#right {  position:absolute;  right:0px;  width:190px;  height:500px;  color:#564b47;  margin:0px;  padding:0px;}</style></head><body><div id="left"></div><div id="right"></div><div id="content"></div><h1>蚂蚁部落欢迎您</h1></body></html>
Nach dem Login kopieren

 

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=9803

更多内容可以参阅:http://www.softwhy.com/divcss/

 

Verwandte Etiketten：
div css三列布局效果实例代码
Quelle：php.cn
Vorheriger Artikel：两列布局的设置方法总结_html/css_WEB-ITnose Nächster Artikel：div中显示页面_html/css_WEB-ITnose
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
Neueste Artikel des Autors
Aktuelle Ausgaben
function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc...
Aus 2024-04-29 11:01:01
0
2
1814
So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln?
Aus 2024-04-23 00:22:19
0
10
1966
Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht.
Aus 2024-04-19 15:37:47
0
1
1662
Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter...
Aus 2024-04-18 23:52:34
0
1
1566
Wo gibt es die Kursunterlagen zum CSS-Mindmapping? Kursunterlagen
Aus 2024-04-16 10:10:18
0
0
1593
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！