div 导航自适应浏览器宽度

<!DOCTYPE html>

<html>

<head>

<title>自适应宽度</title>

<style>

#condition{float:left; text-align:center; }

#condition ul{margin-top:0px; display:inline-block; }

#condition ul li{ float:left; list-style:none; }

</style>

<link rel="stylesheet" href="css/style.css" media="screen" type="text/css" />

</head>

<body>

<div id="condition" >

<ul>

<li>

类型选择:<select  id="${prefix}typeselect"  name="typeselect"  style="width: 70px" >

<option value="1">全部</option>

<option value="2">到货检验</option>

<option value="3">反馈调查</option>

<option value="4">后续监管</option>

</select>

</li>

<li>产品种类:<input  id="${prefix}uncategory"  name="uncategory" type="text"  size="15" onclick="cateonclick()"/></li>

<li>HS编码:<input  id="${prefix}unhscode"  name="unhscode" type="text"  value="" size="15" /></li>

<li>报检单位:<input  id="${prefix}undeclregno"  name="undeclregno" type="text"  value="" size="15" />  </li>

</ul>

<ul>

<li>制造商:<input  id="${prefix}unmanufacturer"  name="unmanufacturer" type="text"  value="" size="15" onclick="open_Manufacturer_box()"></li>

<li>品牌:<select id="${prefix}unbrand"  name="unbrand" style="width: 110px"></select></li>

<li>型号规格:<select id="${prefix}unspecification"  name="unspecification" style="width: 110px"></select>  </li>

<li>收货人:<input  id="${prefix}unfinallyuser" name="unfinallyuser" type="text"  value="" size="15" /></li>

</ul>

<ul>

<li>贸易国别:<input  id="${prefix}untradecountrycode" name="untradecountrycode" type="text"  value="" size="10" />  </li>

<li>原产国:<input  id="${prefix}unorigincountrycode" name="unorigincountrycode" type="text"  value="" size="10" /> </li>

<li>监管区域:<input  id="${prefix}unsupervisionplace" name="unsupervisionplace" type="text"  value="" size="10" /></li>

<li>监管部门:<select id="${prefix}unsupervisionplacedept"  name="unsupervisionplacedept" style="width: 110px"></select>

</li>

<li>

<a href="javascript:void(0)" id="" class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="SearchingRankingUnqualified()">查询</a></li>

</ul>

<div>

</body>

</html>

div 导航自适应浏览器宽度,布布扣,bubuko.com

时间: 2024-07-30 03:24:09

div 导航自适应浏览器宽度的相关文章

怎样让一个div高度自适应浏览器高度

原文:http://www.jb51.net/web/79171.html 原文:http://zhidao.baidu.com/link?url=oId1sFRhiBnV37-RmRE6WQNHxiXvVBlS7wsxpOpKSsw6m6shfBGOArvYE4tTkWag_zeWaEkf7APkf0bZxMQUSlMvBKZNK5G4RIai1gKHc1S 这个老生长谈的问题,不知困扰了多少前端开发人员,和后端程序员,其实很简单,这里写出来,让大家分享下,有很多人说,我已经设置div 100

用纯css3绘制的能自适应浏览器的哆啦a梦动画

最近在研究用css3绘制矢量图,于是就用纯css3绘制了能自适应浏览器宽度的哆啦a梦动画,兼容css3的浏览器都可以正常观看,下面只是网页截图: 废话不多说了,直接给代码. html 代码: <div class="dlam" title="用纯css3绘制的能自适应浏览器的哆啦a梦动画"> <div class="bozi"> <div class="lingdan"> <div c

jquery实现div自适应浏览器高度

<!DOCTYPE html><html><head><meta charset=UTF-8 /><title>jquery实现div自适应浏览器高度(宽度)</title><meta name="keywords" content="html5" /><meta name="description" content="html5 test&quo

表格自动适应浏览器大小及DIV浮动设计(页面自适应浏览器大小)

一.表格自适应浏览器大小 之前写了个页面,将width和height值给定死了,这样导致浏览器缩小时,表格不会跟着自动适应浏览器大小. 解决方法: 1.一般是给表格整体使用样式:table-layout:fixed: 2.将表格中的各个单元格的width和height属性值设为比例,而不是给定值. <table style="width:100%"> <tr> <td style="width:20%">skinny cell&l

两列布局,左边div固定宽度,右边宽度自适应

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Cont

让div自适应浏览器窗口居中显示

今天做 banner 时发现一个问题,就是浏览器窗口水平拉伸时 banner 图未能居中,所以网上找了些资料,自己写了个小 demo html代码: <div class="div1"> <div class="div2">自适应浏览器水平垂直居中</div> </div> css代码: .div1{ width: auto; height: 600px; background: #cccccc; position:

jquery入门 动态调整div大小,使其宽度始终为浏览器宽度

有时候我们需要设置宽度为整个浏览器宽度的div,当然我们可以使用相对布局的方式做到这一点,不过我们也可以用jquery来实现. <!doctype html> <html> <head> <meta charset="utf-8"> <title>jquery test</title> <script src="jquery-1.11.1.min.js"></script>

自适应浏览器高度和宽度+字体大小 JS(主要针对Java后端&gt;&gt;全栈工程师)

自适应浏览器高度和宽度+字体大小有点:1.能自动判断当前浏览器的高度和宽度(页面里面设置均百分比宽度)2.JS里面自己设置字体大小,在不同分辨率下显示不一样的字体3.在浏览器最大化时候,JS会自动判断屏幕高宽,从而使样式布局不会冲突变化4.在浏览器最小化时候,JS会自动判断屏幕高宽,从而使最小化的屏幕还和全屏效果一致,只是出现滚动条全屏效果图01最小化效果图02页面设计效果图自适应高宽JS效果图附上JS代码(引用前必须先引用Jquery!!!)// 作者:[email protected]//

CSS 布局_如何实现容器中每一行的子容器数量随着浏览器宽度的变化而变化?

实现一个浮动布局,红色容器中每一行的蓝色容器数量随着浏览器宽度的变化而变化,就如下图: 要实现这样一个布局,我们首先需要如下的 HTML: <div id="float-container"> <div class="float-element"></div> <div class="float-element"></div> <div class="float-elem