www.ypnh.net > 在HTML中,如何让两个DIV在同一行显示?

在HTML中,如何让两个DIV在同一行显示?

在HTML中,让两个DIV在同一行显示,就是通过float属性来设置的,我们可以通过设置3个div,然后第一个div包裹住其他2个div,然后在设置宽高就可以了,我提交一段代码: <html> <head> <title>DIV的同行测试</title> </head> <body> <div>

两种常用方法:<p class="p_left">左左左左左左左</p><p class="p_right">右右右右右右右</p>.一、.p_left{float:left;}..p_right{float:left;}.二、(中间如果有空格 他会留空格的 上面的就不会,你要块状也可以换成display:inline-block;)..p_

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;&lt;head&gt;&lt;meta http-equiv="Content-Type"

<div style="width: 100%;"> <div style="float:left; width: 40%; border:1px solid red;"></div> <div style="float:left; width: 40%; border:1px solid red;"></div></div>通过左浮动, 可以让两个div在同一行前提是宽度足够.不然会被挤到下面的

可以有这个思路;左右两边都设置最大宽度就好了.左边DIV 宽度最大不超过多少(max-width:XXXpx;)然后 右边那个 就百分比就可以了

<div style="width:200px;"><div style="width:100px;float:left;">1</div><div style="width:100px;float:left;">2</div><div style="width:100px;float:left;">3</div><div style="width:100px;float:left;">4</div></div>

使用style="float:left"样式就可以让两个DIV在同一行,如下例所示:<!DOCTYPE html><head> <title>Untitled</title></head><body><div style="float:left;width:100px;background:red;">第一个</div><div style="float:left;width:100px;

在HTML中,让两个DIV在同一行显示,就是通过float属性来设置的,我们可以通过设置3个div,然后第一个div包裹住其他2个div,然后在设置宽高就可以了,我提交一段代码: <html> <head> <title>DIV的同行测试</title> </head> <body> <div>

首先:把这两个div写在html代码中,如下代码所示.<div class="content">第一个div</div> <div class="content">第二个div</div>其次:再css样式里面对这两个div控制,让其左浮动,或者右浮动,根据自己需要调整.下面给出例子,div的

使用工具:HBuilder.exe 效果: 方法一: 代码含义: width:100px; 宽100像素. height:50px; 高50像素. background: #ccc; 背景颜色灰色. background: #678fff; 背景颜色蓝色. float:left; 元素向左浮动. 实现原理: float:left; 可以使元

网站地图

All rights reserved Powered by www.ypnh.net

copyright ©right 2010-2021。
www.ypnh.net内容来自网络,如有侵犯请联系客服。zhit325@qq.com