CSS+div网页设计,导航栏随页面上下滚动,导航栏宽度变化 20C

最近在学习网站设计,在制作导航栏随网页上下滚动的时候,出现了一些错误,希望懂的小伙伴可以帮忙看一下。
我的错误如下:

当页面打开后导航栏是这样的:

图片说明

但是页面向下拉的时候,虽然导航栏也跟着向下滑动了,但是导航栏的宽度发生了变化:

图片说明

而我想他的样式不变,

相关代码如下,其中由于我想使页面在放大缩小的时候是同比例的放大缩小,所以设置了导航栏宽度为12%,内容的宽度是88%,且他们两个div外的总div宽度是1210px;这个我不想改变,不知道其他哪里出了问题,希望知道办法的小伙伴不吝赐教,实在感谢~

图片说明

图片说明

图片说明

8个回答

position:fixed; 固定导航栏 一般这个是不动的

weixin_35706605
C 回复pluie-cloud: 那在$(function () {$(window).scroll(function () {中具体要设置哪些参数呢,能否说具体一点呢~实在感谢~~
2 年多之前 回复
zy841958835
cloudyzhao position:absolute 设置左右间距就好 注意这个左右边距是跟浏览器的左右边距
2 年多之前 回复
weixin_35706605
C 谢谢~那如果我想实现导航栏随着页面上下滑动,不随页面左右滑动,这个该怎么实现呢
2 年多之前 回复
zy841958835
cloudyzhao 在可以在每次页面大小重调之后 触发$(window).resize 调用重新计算组要内容的宽度 或者导航栏的宽度一起计算
2 年多之前 回复
weixin_35706605
C 设置成position:fixed;确实解决了我当前的问题,但是position:fixed;后我的导航栏width:12.0%;就不和主要的内容container-fluid成比例了,而是和参考屏幕成比,这样一来,我放大缩小页面之后,导航栏和主要内容的宽度比例就变化了,造成导航栏和主要内容之间有很大间隙,很不美观。 请问还有其他解决办法吗,谢谢~ 用百分比设定元素的宽度,一般情况是指参考父元素的宽度,当position是fixed或absolute时,百分比是参考屏幕的宽度.
2 年多之前 回复

图片说明

图片说明

图片说明

两张图没贴上~谢谢各位

建议直接在样式中添加position:fixed定位,可以不用通过一个滚动事件来添加。另外,定位后的内容是脱离文档流的,fixed定位是相对于浏览器定位的。

设置成position:fixed;确实解决了我当前的问题,但是position:fixed;后我的导航栏width:12.0%;就不和主要的内容container-fluid成比例了,而是和参考屏幕成比,这样一来,我放大缩小页面之后,导航栏和主要内容的宽度比例就变化了,造成导航栏和主要内容之间有很大间隙,很不美观。
请问还有其他解决办法吗,谢谢~

用百分比设定元素的宽度,一般情况是指参考父元素的宽度,当position是fixed或absolute时,百分比是参考屏幕的宽度.

图片说明

图片说明

我觉的现在主要的问题在这儿,就是当我向下拉页面的时候,调用函数利用position:fixed;把导航栏固定在了页面上,这个时候导航栏width:12.0%;就不和主要的内容container-fluid成比例了,而是和参考屏幕成比,这样一来,导航栏的宽度就有下拉之前的和“主要的内容container-fluid成比例”变成了和“参考屏幕成比”了,这样一来我的导航栏的宽度当然发生了变化,就成了我帖子里的情况。

兄弟我给你解释一下吧,我觉的问题在这里,你让那两个的Div 的宽度之和已经到了100% 了,但是你又给这两个DIV 设置了margin-left 那么,这两个DIV占据的宽度已经不是你的1210 px了,你明白了吗
weixin_35706605
C 回复Luffy_fans_zh: 好啦我知道怎么改啦,已经改好了,还是谢谢你啦~(*^__^*)
2 年多之前 回复
weixin_35706605
C 回复Luffy_fans_zh: 感谢~按你的方法修改了,问题解决了,两个DIV在一行不会分行了,但是导航栏在下拉的时候宽度任然会变啊,好无奈(ㄒoㄒ)
2 年多之前 回复
huang931027
IAmObject 回复Jioke_c: 你想让两个DIV在一行的话,用 float
2 年多之前 回复
huang931027
IAmObject 回复十里35706605: 那不简单吗,你把两个DIV的宽度的比例稍微改一下,一个 11% , 一个87% ,应该就可以了吧。你把margin-left 也写成百分比的形式,这样只要两个div的宽度和这个margin-left的比例之和是100%就行了
2 年多之前 回复
weixin_35706605
C 感谢~我开始也是这么想的,可是我如果把那两个margin-left 删去,打开网页的时候这两个DIV就不在一行,而是上面一行下面一行了,我也很迷茫啊。我在评论贴个图给你看
2 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
CSS+div网页设计,导航栏随页面上下滚动,导航栏宽度变化
最近在学习网站设计,在制作导航栏随网页上下滚动的时候,出现了一些错误,希望懂的小伙伴可以帮忙看一下。 我的错误如下: 当页面打开后导航栏是这样的: ![图片说明](https://img-ask.csdn.net/upload/201708/28/1503927175_356851.jpg) 但是页面向下拉的时候,虽然导航栏也跟着向下滑动了,但是导航栏的宽度发生了变化: ![图片说明](https://img-ask.csdn.net/upload/201708/28/1503927200_304258.jpg) 而我想他的样式不变, 相关代码如下,其中由于我想使页面在放大缩小的时候是同比例的放大缩小,所以设置了导航栏宽度为12%,内容的宽度是88%,且他们两个div外的总div宽度是1210px;这个我不想改变,不知道其他哪里出了问题,希望知道办法的小伙伴不吝赐教,实在感谢~ ![图片说明](http://img..csdn.net/upload/201708/28/1503927402_761154.jpg) ![图片说明](https://img-ask.csdn.net/upload/201708/28/1503927460_937460.jpg) ![图片说明](https://img-ask.csdn.net/upload/201708/28/1503927472_130945.jpg)
请问如何使用HTML5+CSS3实现粘性导航栏效果,不通过JS
请问如何使用HTML加CCS实现下面这个功能呢 ``` <script src="jquery-1.11.1.min.js"></script> <div style="height:1900px;background:#FC0;margin-top:40px;position:relative;"> <ul id="napppv" class="yungf"> <li>导航栏项目一</li> <li>导航栏项目二</li> <li>导航栏项目三</li> <li>导航栏项目四</li> <li>导航栏项目五</li> </ul> </div> <script> $(function(){ var a = $('#napppv'), b =a.offset(); $(document).on('scroll',function(){ var c = $(document).scrollTop(); if(b.top<=c){ a.css({'position':'fixed','top':'0px'}) }else{ a.css({'position':'absolute','top':'300px'}) } }) }) </script> ```
使用layui 弹出div全屏不可选择与导航栏问题
用户第一次登录 判断是否是新用户 是新用户的话弹出 需要修改信息 这个div一直在 怎么让用户只可以点击这个企业信息页面div里面的东西其他的不可以点击 ```
请教一下,我这个导航栏怎么增加每个导航按钮之间的间距呢?
<!DOCTYPE html> <html> <head> <link rel="icon" href="images/favicon.ico" type="img/x-ico" /> <title>山东金泽网络科技有限公司</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta charset="utf-8"> <meta name="keywords" content="" /> <script type="application/x-javascript"> addEventListener("load", function () { setTimeout(hideURLbar, 0); }, false); function hideURLbar() { window.scrollTo(0, 1); } </script> <link href="css/bootstrap.css" rel='stylesheet' type='text/css' /> <link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" property="" /> <link href="css/style.css" rel='stylesheet' type='text/css' /> <link href="css/simpleLightbox.css" rel='stylesheet' type='text/css' /> <link href="css/fontawesome-all.css" rel="stylesheet"> <link href="http://fonts.googleapis.com/css?family=Poppins:100i,200,200i,300,400,400i,500,500i,600,600i,700,700i,800" rel="stylesheet"> </head> <body> <header> <div class="header_top" id="home"> <nav class="navbar navbar-toggleable-md navbar-light bg-faded"> <a class="navbar-brand" href="index.html"> <i class="fab fa-digital-ocean"></i> 金泽科技</a> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mx-auto tp-nav text-center"> <li class="nav-item active"> <a class="nav-link" href="index.html">首页 <span class="sr-only">(current)</span> </a> </li> <li class="nav-item"> <a class="nav-link" href="about.html">关于</a> </li> <li class="nav-item"> <a class="nav-link" href="了解银豹.html">解决方案</a> </li> <li class="nav-item"> <a class="nav-link" href="blog.html">博客</a> </li> <li class="nav-item"> <a class="nav-link" href="contact.html">联系我们</a> </li> </ul> <form action="#" method="post" class="form-inline my-2 my-lg-0 search"> <input class="form-control mr-sm-2" type="search" placeholder="点击输入搜索..." name="Search" required> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">搜索</button> </form> </div> </nav> </div> </header> <!--//header--> </body> </html> ``` ```
想把视频设置为背景,并在其上方添加图片 导航栏等内容
源代码 <div> <div id="videocontainer"> <video id="fullscreenvideo" playsinline="" autoplay="" muted="" loop=""> <source src="漫威:未来之战 5.0.mp4"> </video> </div> <div id="girlwu"> <img src="图标.jpg" width=100px height=100px /> </div> </div> CSS: #fullscreenvideo{ width:100%; height:100%; position:static; } #videocontainer{ width: 100%; height: 100%; filter:brightness(0.5); z-index: -999; } #girlwu{ width: 5px; heignt:5px; z-index: =2 } 图片中的小图标如何浮在视频上方,div怎么 ![图片说明](https://img-ask.csdn.net/upload/201912/02/1575268545_672762.png)
jsp 页面无法启动,既启动以后导航栏只有地址却不显示,MyEclipse
``` ``` ``` ``` ``` ```index.jsp <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%> <%@page import="util.Info"%> <%@page import="dao.CommDAO"%> <%@page import="util.PageManager"%> <html> <head> <title>数据结构算法学习平台</title><LINK href="qtimages/style.css" type=text/css rel=stylesheet> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="center"><%@ include file="qttop.jsp"%></td> </tr> <tr> <td><table width="974" height="964" border="0" align="center" cellpadding="0" cellspacing="0" id="__01"> <tr> <td height="856"><table id="__01" width="974" height="856" border="0" cellpadding="0" cellspacing="0"> <tr> <td valign="top"><%@ include file="qtleft.jsp"%></td> <td valign="top"><table id="__01" width="700" height="856" border="0" cellpadding="0" cellspacing="0"> <tr> <td><table id="__01" width="700" height="295" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="700" height="45" background="qtimages/1_02_02_01_01.gif"><table width="100%" height="26" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="17%" align="center" valign="middle"><a href="news.jsp?lb=校内新闻"><span class="STYLE3">校内新闻</span></a></td> <td width="83%">&nbsp;</td> </tr> </table></td> </tr> <tr> <td><table id="__01" width="700" height="235" border="0" cellpadding="0" cellspacing="0"> <tr> <td><img src="qtimages/1_02_02_01_02_01.gif" width="12" height="235" alt=""></td> <td width="436" height="235" valign="top" bgcolor="#FFFFFF"><table width="98%" border="0" align="center" cellpadding="0" cellspacing="0" class="newsline"> <% for(HashMap map:new CommDAO().select("select * from xinwentongzhi where leibie='校内新闻' order by id desc ",1,9)){ %> <tr height="25"> <td width="16" align="center" class="newslist"><img src="qtimages/1.jpg" /></td> <td width="374" class="newslist"><a href="gg_detail.jsp?id=<%=map.get("id")%>"><%=Info.ensubStr(map.get("biaoti"),24)%></a></td> <td width="76" align="center" class="newslist"><%=map.get("addtime").toString().substring(0,10) %></td> </tr> <% } %> </table></td> <td width="252" height="235" align="center" background="qtimages/1_02_02_01_02_03.gif"> <%=new CommDAO().DynamicImage("",6,240,215) %></td> </tr> </table></td> </tr> <tr> <td><img src="qtimages/1_02_02_01_03.gif" width="700" height="15" alt=""></td> </tr> </table></td> </tr> <tr> <td><table id="__01" width="700" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="700" height="42" background="qtimages/1_02_02_02_01.gif"><table width="100%" height="26" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="17%" align="center" valign="middle"><span class="STYLE3">学生风采</span></td> <td width="83%">&nbsp;</td> </tr> </table></td> </tr> <tr> <td><table id="__01" width="700" height="170" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="12" background="qtimages/1_02_02_02_02_01.gif">&nbsp;</td> <td width="680" height="170" bgcolor="#FFFFFF"> <div id=demo style="overflow:hidden;width:680;" align=center> <table border=0 align=center cellpadding=1 cellspacing=1 cellspace=0 > <tr><td valign=top id=marquePic1 ><table width='680' border='0' cellspacing='0'><tr> <% for(HashMap m:new CommDAO().select("select * from xueshengzhuce order by id desc",1,8){ %> <td align=center width="190"><a href="xueshengzhucedetail.jsp?id=<%=m.get("id") %>" target=""><img src="<%=m.get("zhaopian") %>" width=135 height=140 border=0><br> <br><%=m.get("xueshengxingming") %></a></td> <%} %> </tr></table> </td><td id=marquePic2 valign=top></td></tr> </table></div> <script type="text/javascript"> var speed=50 marquePic2.innerHTML=marquePic1.innerHTML function Marquee(){ if(demo.scrollLeft>=marquePic1.scrollWidth){ demo.scrollLeft=0 }else{ demo.scrollLeft++ } } var MyMar=setInterval(Marquee,speed) demo.onmouseover=function() {clearInterval(MyMar)} demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)} </script> </td> <td width="8" background="qtimages/1_02_02_02_02_03.gif">&nbsp;</td> </tr> </table></td> </tr> <tr> <td><img src="qtimages/1_02_02_02_03.gif" width="700" height="14" alt=""></td> </tr> </table></td> </tr> <tr> <td><table id="__01" width="700" height="240" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="700" height="42" background="qtimages/1_02_02_02_01.gif"><table width="100%" height="26" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="17%" align="center" valign="middle"><a href="news.jsp?lb=实时快报"><span class="STYLE3">实时快报</span></a></td> <td width="36%">&nbsp;</td> <td width="47%"><a href="news.jsp?lb=热点资讯"><span class="STYLE3">热点资讯</span></a></td> </tr> </table></td> </tr> <tr> <td><table id="__01" width="700" height="184" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="12" background="qtimages/1_02_02_02_02_01.gif">&nbsp;</td> <td width="680" height="265" bgcolor="#FFFFFF"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="50%" valign="top"><table width="98%" border="0" align="center" cellpadding="0" cellspacing="0" class="newsline"> <% for(HashMap map:new CommDAO().select("select * from xinwentongzhi where leibie='实时快报' order by id desc ",1,11)){ %> <tr height="25"> <td width="16" align="center" class="newslist"><img src="qtimages/1.jpg" /></td> <td width="374" class="newslist"><a href="gg_detail.jsp?id=<%=map.get("id")%>"><%=Info.ensubStr(map.get("biaoti"),24)%></a></td> </tr> <% } %> </table></td> <td width="1%">&nbsp;</td> <td width="49%" valign="top"><table width="98%" border="0" align="center" cellpadding="0" cellspacing="0" class="newsline"> <% for(HashMap map:new CommDAO().select("select * from xinwentongzhi where leibie='热点资讯' order by id desc ",1,11)){ %> <tr height="25"> <td width="16" align="center" class="newslist"><img src="qtimages/1.jpg" /></td> <td width="374" class="newslist"><a href="gg_detail.jsp?id=<%=map.get("id")%>"><%=Info.ensubStr(map.get("biaoti"),24)%></a></td> </tr> } </table></td> </tr> </table></td> <td width="8" background="qtimages/1_02_02_02_02_03.gif">&nbsp;</td> </tr> </table></td> </tr> <tr> <td><img src="qtimages/1_02_02_02_03.gif" width="700" height="14" alt=""></td> </tr> </table></td> </tr> </table></td> </tr> </table></td> </tr> <tr> <td height="108"><%@ include file="qtdown.jsp"%></td> </tr> </table></td> </tr> </table> </body> </html> qtleft.jsp ``` ```
HTML关于导航栏布局问题
``` <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>碧桂园官网</title> <style type="text/css"> *{margin:0 auto;} header{ /*整个导航栏的高度设定*/ width:100%; height:90px; background: red; } header>img{ /*logo的位置*/ width:200px; height:90px; margin-left:100px; } header>div>ul>li>a{ /*导航栏超链接中字体去下划线、加粗、颜色、间隔*/ text-decoration:none; color:#999; font-weight:bold; border-right:dotted thin; padding-right:10px; padding-left:10px; font-size:15px; } .header_nav{ /*整个导航栏的位置*/ width: 100%; display:inline; position:absolute; padding-top:40px; padding-left:300px; } .header_nav ul li{ /*ul去点和横向排列*/ list-style:none; display:inline; } .header_nav>ul>li>ul{ /*二级菜单位置、隐藏*/ position:absolute; padding-top: 40px; display: none; } .header_nav>ul>li>ul>li>a{ /*二级菜单样式*/ font-weight: bold; color: black; text-decoration: none; } .header_nav>ul>li:hover>ul{ /*鼠标经过时显示二级菜单*/ display: block; } </style> <header> <img src="logo.PNG" alt="logo"/> <div class="header_nav"> <ul> <li><a href="#">首页</a></li> <li><a href="#">关于碧桂园</a> <ul> <li><a href="#">公司介绍</a></li> <li><a href="#">企业文化</a></li> </ul> </li> <li><a href="#">产品与服务</a></li> <li><a href="#">新闻中心</a></li> <li><a href="#">投资者关系</a></li> <li><a href="#">人力资源</a></li> <li><a href="#">社会责任</a></li> </ul> </div> </header> </head> <body> </body> </html> ``` ![图片说明](https://img-ask.csdn.net/upload/201906/04/1559625035_544891.jpg) 我模仿碧桂园官网的导航栏自己做了一个 但是在布局那里出现了一个问题,CSS样式中header nav这个样式(我注释是整个导航栏的位置) 我用了width:100%的话,浏览器窗口缩小时导航栏时不会变的,但是在全屏时他右边会有一段空白,像图①那样 但是我如果不用width:100%的话,浏览器窗口缩小后导航栏就会被挤在浏览器边缘右边那里了,像图②那样。 请问应该要怎么设置才能让浏览器全屏的时候右边不会有空白,缩小后导航栏不会被挤在一堆。 还有我想做一个鼠标经过一级导航栏时会显示二级导航栏的功能,大佬们可以上百度搜以下碧桂园的官网看那个效果,我做了出来了,但是那个黑色透明背景我不会做,能指点以下吗?
请问怎么实现js控制的二级旋转导航栏
我使用的vue框架。 这个组件写出来是为了写一个用js控制的二级旋转导航栏,但是我写完收回这部分的时候却出现了问题。 在我上一个setTimeout还没结束的时候就把鼠标离开的话,就会出现,上一个setTimeout还没把所有的li展开,鼠标离开所建立的setTimeout就已经把上面的收回去了,导致下面的li标签还在,上面的已经空了。 ![图片说明](https://img-ask.csdn.net/upload/201911/12/1573550292_724743.png) 也写了其他的一些方法,但问题都差不多。 现在就是想知道应该怎么把这个问题解决 自学的js,经历过的东西不多,如果大佬要喷请轻点。 ``` index.vue <RotatingMenu box="box" ulid="ul" entercss="transform:rotateY(0deg);opacity:1;height:30px;" leavecss="transform:rotateY(90deg) rotateX(-30deg) rotateZ(45deg);opacity:0;height:0;" ></RotatingMenu> RotatingMenu.vue <template> <div class="RotatingMenu p_box" :class="box"> <p @mouseenter="click('.'+ulid,'enter',entercss)" @mouseleave="click('.UL1','leave',leavecss)" >animation:{{message}} <ul class="UL1" :class="ulid" ref="ul"> <li ref="li" v-for='it in list'> <span>{{it.title}}</span> </li> </ul></p> </div> </template> data()-- message:'动画', list:[ {title:'第一个'},{title:'第二个'},{title:'第三个'},{title:'第四个'},{title:'第五个'},{title:'第六个'}, {title:'第七个'},{title:'第八个'},{title:'第九个'},{title:'第十个'},{title:'第十一个'},{title:'第十二个'}, ], 函数--: click(cl,el,en,le){ console.log(cl) var ali = document.querySelectorAll(cl+" li");//拼接选择的样式 var aList = Array; aList = ali; let csslist ; if(el==='enter'){//鼠标进入时展开 csslist = en; for(let i in this.list){ let ai = parseInt(i); let time = setTimeout(function(){ aList[ai].style.cssText = csslist; },200*i) } }else if(el==='leave'){//鼠标离开时收回 csslist = le; for(let i in this.list){ let ai = parseInt(i); let unai = parseInt(-(i-this.list.length+1)); // console.log(unai) let time = setTimeout(function(){ aList[unai].style.cssText = csslist; },200*i) } }else{console.log("数据错了。")} console.log("csslist:"+csslist) }, 样式---:(用了scss) .p_box{ position: relative; color: white; p{ margin-left: 10px; width: 150px; height: 150px; background-color:#1670F0; ul{ position: absolute; top: 100%; li{ background-color: blue; transition: all 1s; opacity:0; height: 0; width: 150px; } } } } ```
css二级导航浮动问题,为什么二级导航没有浮动
http://img.mukewang.com/5da0470c0001266411060156.jpg 请问为什么我的二级导航没有浮动起来 http://img2.mukewang.com/5da0462a00010b2309050139.jpg 给定ul宽度的时候才浮起来了 我的一级导航栏不要定宽度也能浮动起来啊这是为什么。哪些错了求解。 <style type="text/css"> li,ul { list-style: none; padding: 0; margin: 0; } .nav{ margin-top: 20px; height: 44px; background: linear-gradient(114deg,#00d0d4 5%,#00c5c3 51%,#9effa4 100%); } .nav .nav_li_div{ position: relative; height: 44px; margin: 0 auto; font-size: 16px; font-weight: bold; } .nav .nav_li_div .nav_li{ position: relative; float: left; height: 44px; width: 60px; text-align: center; line-height: 44px; } .nav .nav_li_div .nav_li a{ display: block; height: 44px; text-decoration: none; color: white; } .nav .nav_li_div .nav_li:hover{ text-decoration: none; color: white; background: #00BCD4; } .nav .nav_li_div .nav_li_active{ background: #00BCD4; } .nav_tag_local{ position: absolute; top: -10px; left: 545px; z-index: 2; } .nav .nav_li_div .nav_li .second_nav_div{ background: white; border: 1px solid #00bcd4; position: absolute; height: 44px; top: 42px; font-size: 14px; z-index: 2; display: block; /* display: none; */ } .nav .nav_li_div .nav_li .second_nav_div li{ float: left; height: 42px; } .nav .nav_li_div .nav_li .second_nav_div li a{ font-size: 12px; text-align: center; color: #666; width: 80px; height: 42px; display: block; line-height: 42px; text-decoration: none; } .nav .nav_li_div .nav_li .second_nav_div li:hover{ background: #E0F7FA; } </style> </head> <body> <div class="nav"> <ul class="nav_li_div"> <li class="nav_li nav_li_active"><a href="">首页</a></li> <li class="nav_li"><a href="">机票</a></li> <li class="nav_li"><a href="">酒店</a></li> <li index="4" class="nav_li"><a href="">团购</a> <ul index="4" class="second_nav_div clear" style="left:0"> <li><a href="">度假团购</a></li> <li><a href="">周边休闲</a></li> <li><a href="">长线游</a></li> </ul> </li> <li index="5" class="nav_li"><a href="">度假</a></li> <li class="nav_li"><a href="">邮轮</a></li> <li index="7" class="nav_li"><a href="">门票</a></li> <li class="nav_li"><a href="">火车票</a></li> <li index="9" class="nav_li"><a href="">攻略</a></li> <li index="10" class="nav_li"><a href="">当地人</a></li> <li index="11" class="nav_li"><a href="">车车</a></li> <li class="nav_li"><a href="">汽车票</a></li> <li class="nav_li"><a href="">境外</a></li> <li class="nav_li"><a href="">保险</a></li
关于Bootstrap中导航栏问题
我使用了bootstrap的响应式导航栏功能,为了使导航栏中每个<li>元素拥有同样的宽度,我设置CSS样式 width:16.6%;在页面未折叠之前,都运行良好。 ![图片说明](https://img-ask.csdn.net/upload/201708/18/1503060999_502542.jpg) 可是折叠之后就成了这样 ![图片说明](https://img-ask.csdn.net/upload/201708/18/1503060468_601164.jpg) 本来“start”(navbar-band)应该单独占一行的,现在和要折叠的内容在同一行了。 我觉得这是由于我设置了<li>元素宽度的问题,但如果我不设置其宽度,每个<li>元素的 宽度就不等,这样在应用a:hover时就显得很难看。请问该怎样解决? html ``` <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html" charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Marine Geology Office 201</title> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="styles/index.css" rel="stylesheet" media="screen" /> </head> <body> <header> <div class="container"> <div class="row"> <div class="col-sm-8 col-xs-12"> <div class="row"> <div class="col-sm-3 col-xs-4"> <a href="http://www.zju.edu.cn/"><img id="logo" src="images/school.gif" class="img-responsive" alt="ZJU" /></a> </div> <div class="col-sm-9 col-xs-8"> <h1 id="title" class="text-left"><b><i>Marine Geology Office 201</i></b></h1> </div> </div> </div> <div class="col-sm-4 col-xs-12"> <form role="form" id="search"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search..." /> <span class="input-group-btn"> <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search"></span></button> </span> </div> </form> </div> </div> </div> <div class="container"> <nav class="navbar" role="navigation"> <div class="nav-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand visible-xs" href="#">Start</a> </div> <div class="collapse navbar-collapse" id="navbar"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">Introduction</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Teachers <b class="caret"></b> </a> <ul class="dropdown-menu" role="meun"> <li><a href="#">ChunFeng Li</a></li> <li><a href="#">YingMin Wang</a></li> </ul> </li> <li><a href="#">Students</a></li> <li><a href="#">News</a></li> <li><a href="#">Contact</a></li> </ul> </div> </nav> </div> </header> <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </body> </html> ``` index.css ``` body{ background-color:#fdfcf8; margin-left:10%; margin-right:10%; margin-top:1em; } #logo{ min-width:4em; padding-left:10%; padding-right:10% } #title{ padding-top:5%; margin-left:-0.5em; } #search{ padding-top:0.3em; } nav{ margin-top:0.5em; background-color:#A52A2A; } #navbar>ul{ width:100%; } #navbar>ul>li{ width:16.5%; min-width:13em; } #navbar>ul>li>a{ color:#FFFFFF; font-size:2em; text-align:center; } #navbar>ul>li>a:visited{ color:#FFFFFF; font-size:2em; text-align:center; font-weight:bold; background-color:#DC143C; } #navbar>ul>li>a:hover{ color:#FFFFFF; font-size:2em; text-align:center; font-weight:bold; background-color:#DC143C; } #navbar>ul>li>a:active{ color:#FFFFFF; font-size:2em; text-align:center; font-weight:bold; background-color:#DC143C; } div.nav-header>button{ background-color:#FFFFFF; } div.nav-header>button>span{ background-color:#A52A2A; } #navbar ul.dropdown-menu{ width:100%; } #navbar ul.dropdown-menu a{ font-size:20px; text-align:center; } div.nav-header a{ color:#FFFFFF; font-weight:bold; font-size:25px; } ```
导航栏弹出菜单的制作
怎么才能让 第一个li的大小不随里面的div宽度变化而变化 我弄出来要把后面的li给挤开。。 :oops: <div class="content"> <ul> <li style="width:110px;height:50px;"> 导航栏菜单1 <div style="border:solid 1px; width:500px; position:relative; top:30px;"> 英雄你好好好英雄你好好好英雄你好好好英雄你好好好 </div> </li> <li> 导航栏菜单2 </li> </ul> </div>
用html+css哦导航栏,我的导航栏的的div跑到最顶部去了,怎么修改 html和css的代码都在下面
<div class="iteye-blog-content-contain" style="font-size: 14px;"> <p>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;</p> <p>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;</p> <p>&lt;head&gt;</p> <p>&lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312" /&gt;</p> <p>&lt;title&gt;无标题文档&lt;/title&gt;</p> <p>&lt;link href="test.css" rel="stylesheet" type="text/css" /&gt;</p> <p> </p> <p> </p> <p>&lt;/head&gt;</p> <p> </p> <p>&lt;body&gt;</p> <p>&lt;div class="contariner" &gt;</p> <p> </p> <p>&lt;div class="bor_1" &gt;</p> <p>&lt;div class="bor_1_left"&gt;&lt;/div&gt;</p> <p>&lt;div class="bor_1_center"&gt;&lt;/div&gt;</p> <p>&lt;div class="bor_1_right"&gt;</p> <p>     &lt;ul&gt;</p> <p>&lt;li&gt;&lt;a href="#"&gt;登陆&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;/li&gt;</p> <p>&lt;li&gt;&lt;a href="#" &gt;注册&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;/li&gt;</p> <p> &lt;/ul&gt;</p> <p>&lt;/div&gt;</p> <p>&lt;/div&gt;</p> <p> </p> <p> </p> <p>&lt;div class="top_1"&gt;</p> <p>&lt;div class="top_1_left"&gt;</p> <p>&lt;ul&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#" &gt;首页&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#"&gt;相册&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#"&gt;日志&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#"&gt;个人信息&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#"&gt;iteye&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;/ul&gt;</p> <p>&lt;/div&gt;</p> <p> </p> <p>  &lt;div id="top_right"&gt;</p> <p> </p> <p>&lt;ul&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#" &gt;个人中心&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;li class="STYLE1"&gt;&lt;a href="#"&gt;百度知道&lt;/a&gt;&lt;/li&gt;</p> <p>&lt;/ul&gt;</p> <p>&lt;/div&gt;</p> <p> </p> <p> </p> <p> </p> <p>&lt;/div&gt;</p> <p> </p> <p> </p> <p>&lt;/body&gt;</p> <p>&lt;/html&gt;</p> <p> </p> <p> </p> <p> </p> <p>.contariner {</p> <p>height: 800px;</p> <p>width: 1340px;</p> <p>}</p> <p>.STYLE1 {</p> <p>font-size: 16px;</p> <p>font-weight: bold;</p> <p>}</p> <p> </p> <p>.contariner .bor_1 {</p> <p>background-color:#FFFFFF;</p> <p>height: 60px;</p> <p>width: 1240px;</p> <p>border: thin dashed #CCCCCC;</p> <p>font-style: normal;</p> <p>float:right;</p> <p> </p> <p> </p> <p>}</p> <p>.contariner .bor_1_left{</p> <p>background-color:#999;</p> <p>height:58px;</p> <p>width:800px;</p> <p>float:left;</p> <p> </p> <p>}</p> <p> </p> <p>.contariner .bor_1_center{</p> <p>background:#330033;</p> <p>    height:58px;</p> <p>width:150px;</p> <p>float:left;</p> <p>}</p> <p> </p> <p>.contariner .bor_1_right{</p> <p>background-color:#00FF00;</p> <p>height:58px;</p> <p>width:288px;</p> <p>float:right;</p> <p>}</p> <p> </p> <p> </p> <p>.contariner .bor_1 .bor_1_right li {</p> <p>background-position: top;</p> <p>float: right;</p> <p>list-style-type: none;</p> <p>margin: 0px;</p> <p>padding: 1px;</p> <p>}</p> <p> </p> <p> </p> <p> </p> <p>.contariner .top_1 #top_right {</p> <p>background-color: #00CC00;</p> <p>margin-left:900px;</p> <p>height: 30px;</p> <p>width: 220px;</p> <p>margin-top:-48px;</p> <p>}</p> <p> </p> <p>.contariner .top_1 #top_right ul li {</p> <p>background-color: #00CC00;</p> <p>list-style-type: none;</p> <p>line-height: 30px;</p> <p>width:110px;</p> <p>float: right;</p> <p>text-align: center;</p> <p>margin-bottom: 1p</p> <p>}</p> <p> </p> <p>.contariner .top_1 {</p> <p>margin-top:65px;</p> <p>background-color: #00FF00;</p> <p>height: 30px;</p> <p>width: 1340px;</p> <p>border: 1px dashed #FFFFFF;</p> <p>list-style-type: none;</p> <p> </p> <p>}</p> <p> </p> <p> </p> <p> </p> <p>.contariner .top_1 .top_1_left {</p> <p>background-color: #00CC00;</p> <p>height: 30px;</p> <p>width: 600px;</p> <p>margin-left:100px;</p> <p>margin-top:-15px;</p> <p> </p> <p>}</p> <p> </p> <p>.contariner .top_1 .top_1_left ul li{</p> <p>background-color: #00CC00;</p> <p>list-style-type: none;</p> <p>line-height: 30px;</p> <p>width:110px;</p> <p>float: left;</p> <p>text-align: center;</p> <p>margin-bottom: 1px;</p> <p>}</p> <p> </p> <p>.contariner .top_1 .top_1_left ul li a{</p> <p>   font-size: 22px;</p> <p>color: #000;</p> <p>text-decoration: none;</p> <p>display:block;</p> <p> </p> <p>}</p> <p> </p> <p>.contariner .top_1 .top_1_left ul li a:hover{</p> <p>background-color:#006699;</p> <p> </p> <p>}</p> <p> </p> <p> </p> </div>
APICloud在结合AUI组件后如何实现底部导航栏的切换?
哪位大佬知道APICloud在结合AUI组件后如何实现底部导航栏的切换? 我的程序如下: 出错的原因是:randomSwitchBtn is not defined at jibu.html, ``` <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" /> <meta name="format-detection" content="telephone=no,email=no,date=no,address=no"> <title>智步</title> <link rel="stylesheet" type="text/css" href="../css/aui.css" /> <style type="text/css"> .text-white { color: #FFFFFF !important; } .aui-grid [class*=aui-col-] { padding: 0.75rem 0; } </style> </head> <body> <header id="header" class="aui-bar aui-bar-nav" tapmode style="background-color:#AE0000;">智步</header> <footer id="footer" class="aui-bar aui-bar-tab"> <div class="aui-bar-tab-item aui-active selected" tapmode onclick="randomSwitchBtn(this,'计步',0)"> <i class="aui-iconfont aui-icon-paper aui-text-danger"></i> <div class="aui-bar-tab-label" style="color:red;">计步</div> </div> <div id="tabbar2" class="aui-bar-tab-item" tapmode onclick="randomSwitchBtn(this,'定位',1)"> <i class="aui-iconfont aui-icon-location"></i> <div class="aui-bar-tab-label">定位</div> </div> <div id="tabbar3" class="aui-bar-tab-item" tapmode onclick="randomSwitchBtn(this,'我的',2)"> <i class="aui-iconfont aui-icon-my"></i> <div class="aui-bar-tab-label">我的</div> </div> </footer> </body> <script type="text/javascript" src="../script/api.js"></script> <script type="text/javascript"> apiready = function() { api.parseTapmode(); var $header = $api.dom('header'); $api.fixStatusBar($header); var body = $api.dom('body'); var $footer = $api.byId('footer'); var headerH = $api.offset('header'); var bodyH = api.winHeight; var footerH = $api.offset('footer'); api.openFrameGroup({ name: 'foot_tab_demo', scrollEnabled: true, rect: { x: 0, y: headerH, w: 'auto', h: bodyH - headerH - footerH }, index: 0, preload: 3, frames: [{ name: 'jibu', url: 'html/jibu.html', bgColor: '#fff' }, { name: 'dingwei', url: 'html/dingwei.html', bgColor: '#fff' }, { name: 'my', url: 'html/my.html', bgColor: '#fff' }] }, function(ret, err) { if (ret) { var footer = $api.byId('footer'); var footerAct = $api.dom(footer, '.aui-bar-tab-item.aui-active'); $api.removeCls(footerAct, 'aui-active'); var name = ret.name; var index = ret.index; if (index == 0) { $api.text($api.byId('aui-header'), '计步'); $api.addCls($api.byId('tabbar1'), 'aui-active'); } else if (index == 1) { $api.text($api.byId('aui-header'), '定位'); $api.addCls($api.byId('tabbar2'), 'aui-active'); } else if (index == 2) { $api.text($api.byId('aui-header'), '我的'); $api.addCls($api.byId('tabbar3'), 'aui-active'); } } }) function randomSwitchBtn(obj, name, index) { $api.text($api.byId('aui-header'), name); var footer = $api.byId('footer'); var footerAct = $api.dom(footer, '.aui-bar-tab-item.aui-active'); $api.removeCls(footerAct, 'aui-active'); $api.addCls(obj, 'aui-active'); api.setFrameGroupIndex({ name: 'footer_tab_demo', index: index, scroll: true }); } function closeWin() { api.closeWin(); } } </script> </html> ```
关于使用maven tomcat插件调试,出现前端界面导航栏无法显示的问题
## 部署到tomcat服务器中显示正常 ![部署到tomcat服务器中显示正常](https://img-ask.csdn.net/upload/201806/16/1529112367_589180.png) ## 左侧本该有的导航栏没有显示出来 ![左侧本该有的导航栏没有显示出来](https://img-ask.csdn.net/upload/201806/16/1529112400_743757.png) 我定位到那个html网页, ``` [#macro script] [/#macro] [#macro script_import] [/#macro] [#macro css] [/#macro] [#macro css_import] [/#macro] [#macro layout] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> [#include "/includes/header.html" /] [@css_import /] <style type="text/css"> [@css /] </style> </head> <body class="fixed-sidebar full-height-layout gray-bg" style="overflow:hidden"> <!-- Site wrapper --> <div id="wrapper"> [#include "/includes/menus.html" /] <!--右侧部分开始--> <div id="page-wrapper" class="gray-bg dashbard-1"> <div class="row border-bottom"> <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0"> <div class="navbar-header"><a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="javascript:void(0)"><i class="fa fa-bars"></i> </a> <form role="search" class="navbar-form-custom" method="post" action="search_results.html"> <div class="form-group"> <a href="http://www.dbumama.com" class="form-control" style="padding-top:16px" target="_blank">在线帮助</a> </div> </form> </div> <ul class="nav navbar-top-links navbar-right"> <li class="dropdown hidden-xs"> [@shiro.authenticated] [@shiro.authUser] [#if authUser??] <a href="javascript:void(0)" class="dropdown-toggle">${authUser.app_name}</a> [#else] <a href="${webctx}/setting" class="dropdown-toggle" style="color: red">未绑定公众账号,去绑定</a> [/#if] [/@shiro.authUser] [/@shiro.authenticated] </li> <li class="dropdown hidden-xs"> <a href="javascript:void(0)"> [@shiro.authenticated] [@shiro.principal name="phone"/] [/@shiro.authenticated]</a> </li> <li class="hidden-xs"><a href="${webctx}/logout"><i class="fa fa-power-off"></i>退出</a></li> </ul> </nav> </div> <div class="row J_mainContent" id="content-main"> [#nested] </div> [#include "/includes/footer.html"/] </div> <!--右侧部分结束--> </div> <!-- ./wrapper --> [@script_import /] <script> [@script /] $(document).ready(function(){ fix(); }); function fix() { var neg = $('.main-header').outerHeight() + $('.main-footer').outerHeight(); var window_height = $(window).height(); var sidebar_height = $(".sidebar").height(); if (window_height >= sidebar_height + neg) { $(".content-wrapper, .right-side").css('min-height', window_height - neg); } else { $(".content-wrapper, .right-side").css('min-height', sidebar_height ); } } </script> </body> </html> [/#macro] ``` 大概觉得右侧的导航栏应该是这一段,通过认证,然后从数据库中取导航项目。 ``` <li class="dropdown hidden-xs"> <a href="javascript:void(0)"> [@shiro.authenticated] [@shiro.principal name="phone"/] [/@shiro.authenticated]</a> </li> ``` # 我的问题:怎样才能让左侧导航栏在用tomcat插件调试的时候能够显示出来?感觉跟认证有关系,还请大神帮忙看看问题出在哪里?还有网页中大量出现的[@shiro.authenticated]、[#macro script_import]是什么意思?。万分感谢 #
index.jsp中的代码和网页源代码不一致,求问怎么修改上面导航栏的文字
![图片说明](https://img-ask.csdn.net/upload/201904/26/1556259789_913540.png) 网页源代码里有下面内容 ``` <div id="divmenu"> <a href="/bookstore/showProductByPage?category=文学">文学</a> <a href="/bookstore/showProductByPage?category=生活">生活</a> <a href="/bookstore/showProductByPage?category=计算机">计算机</a> <a href="/bookstore/showProductByPage?category=外语">外语</a> <a href="/bookstore/showProductByPage?category=经营">经管</a> <a href="/bookstore/showProductByPage?category=励志">励志</a> <a href="/bookstore/showProductByPage?category=社科">社科</a> <a href="/bookstore/showProductByPage?category=学术">学术</a> <a href="/bookstore/showProductByPage?category=少儿">少儿</a> <a href="/bookstore/showProductByPage?category=艺术">艺术</a> <a href="/bookstore/showProductByPage?category=原版">原版</a> <a href="/bookstore/showProductByPage?category=科技">科技</a> <a href="/bookstore/showProductByPage?category=考试">考试</a> <a href="/bookstore/showProductByPage?category=生活百科">生活百科</a> <a href="/bookstore/showProductByPage" style="color:#FFFF00">全部商品目录</a> </div> ``` 但我jsp里找不到这些,求大佬指教 index.jsp: ``` <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>花之语</title> <%-- 导入css --%> <link rel="stylesheet" href="${pageContext.request.contextPath}/client/css/main.css" type="text/css" /> <!-- 导入首页轮播图css和js脚本 --> <link type="text/css" href="${pageContext.request.contextPath }/client/css/autoplay.css" rel="stylesheet" /> <script type="text/javascript" src="${pageContext.request.contextPath }/client/js/autoplay.js"></script> </head> <body class="main"> <%@include file="head.jsp"%> <%@include file="menu_search.jsp" %> <%-- <div id="divad"> <img src="${pageContext.request.contextPath}/client/ad/index_ad.jpg"/> </div> --%> <!-- 首页轮播图 start --> <div id="box_autoplay"> <div class="list"> <ul> <li><img src="${pageContext.request.contextPath }/client/ad/ad1.png" width="900" height="335" /></li> <li><img src="${pageContext.request.contextPath }/client/ad/ad2.png" width="900" height="335" /></li> <li><img src="${pageContext.request.contextPath }/client/ad/ad3.png" width="900" height="335" /></li> <li><img src="${pageContext.request.contextPath }/client/ad/ad4.jpg" width="900" height="335" /></li> <li><img src="${pageContext.request.contextPath }/client/ad/ad5.jpg" width="900" height="335" /></li> </ul> </div> </div> <!-- 首页轮播图 end --> <div id="divcontent"> <table width="900px" border="0" cellspacing="0"> <tr> <td width="497"> <img src="${pageContext.request.contextPath}/client/images/billboard.gif" width="497" height="38" /> <table cellspacing="0" class="ctl"> <tr> <td width="485" height="29">${n.details }</td> </tr> </table> </td> <td style="padding:5px 15px 10px 40px"> <table width="100%" border="0" cellspacing="0"> <tr> <td> <img src="${pageContext.request.contextPath}/client/images/hottitle.gif" width="126" height="29" /> </td> </tr> </table> <table width="100%" border="0" cellspacing="0"> <tr> <c:forEach items="${pList }" var="pArray"> <td style="width:80; text-align:center"> <a href="${pageContext.request.contextPath}/findProductById?id=${pArray[0]}"> <img src="${pageContext.request.contextPath }${pArray[2]}" width="102" height="130" border="0" /> </a> <br /> <a href="${pageContext.request.contextPath}/findProductById?id=${pArray[0]}">${pArray[1]}</a> <%-- <br />作者:${pArray[2] } --%> </td> </c:forEach> </tr> </table> </td> </tr> </table> </div> <%@ include file="foot.jsp" %> </body> </html> ``` 网页图如下
如何解决下拉菜单被遮罩(flex布局,bootstrap导航栏组件)大神救救我
## 下拉菜单被遮罩(flex布局,bootstrap导航栏组件)如何解决 ### 尝试过设置z-index 没解决 ![图片说明](https://img-ask.csdn.net/upload/201904/20/1555771736_501325.png) ### test.html ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!--保证缩放--> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! --> <!-- 引入bootstrap--> <link rel="stylesheet" type="text/css" href="bootstrap/3.3.7/css/bootstrap.min.css" /> <script type="text/javascript" src="bootstrap/3.3.7/js/jquery-3.3.1.min.js"></script> <script src="bootstrap/3.3.7/js/bootstrap.min.js"></script> <!-- 引入自定义样式 --> <link rel="stylesheet" href="css/test.css"> <!-- 添加网站图标 --> <link rel="icon" href="img/water.ico" type="image/x-icon" /> <link rel="shortcut icon" href="img/water.ico" type="image/x-icon" /> <title>ouc-污水分析-about</title> </head> <body class="bg-img"> <!-- Static navbar --> <nav class="zmost navbar navbar-inverse navbar-default navbar-static-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">ouc-污水分析</a> </div> <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li> <a href="index.html">Home</a> </li> <li class="active"> <a href="about.html">About</a> </li> <li> <a href="contact.html">Contact</a> </li> </ul> <ul class="nav navbar-nav navbar-right"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">User<span class="caret"></span></a> <ul class="dropdown-menu"> <li> <a href="#">Action</a> </li> <li> <a href="#">Something else here</a> </li> <li role="separator" class="divider"></li> <li class="dropdown-header">Nav header</li> <li> <a href="#">Separated link</a> </li> <li> <a href="#">One more separated link</a> </li> </ul> </li> </ul> </div> </div> </nav> <!-- About info --> <div class="container about zless"> <h1 class="about-title flex-center-block">网站声明</h1> <p class="about-content flex-center-block"> 污水处理按照其作用可分为物理法、生物法和化学法三种。 ①物理法:主要利用物理作用分离污水中的非溶解性物质,在处理过程中不改变化学性质。常用的有重力分离、离心分离、反渗透、气浮等。物理法处理构筑物较简单、经济,用于村镇水体容量大、自净能力强、污水处理程度要求不高的情况。 ②生物法:利用微生物的新陈代谢功能,将污水中呈溶解或胶体状态的有机物分解氧化为稳定的无机物质,使污水得到净化。常用的有活性污泥法和生物膜法。生物法处理程度比物理法要高。 ③化学法:是利用化学反应作用来处理或回收污水的溶解物质或胶体物质的方法,多用于工业废水。常用的有混凝法、中和法、氧化还原法、离子交换法等。化学处理法处理效果好、费用高,多用作生化处理后的出水,作进一步的处理,提高出水水质。 </p> </div> <!-- footer --> <div class="footer">@Copyright-中国海洋大学</div> </body> </html> ``` ### test.css ``` bg-img { background-image: url(../img/bg.jpg); background-repeat: no-repeat; background-attachment: fixed; background-position: center; background-size: 100%; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; } body { display: flex; flex-direction: column; justify-content: space-between; height: calc(100vh); min-width: 380px; min-height: 680px; } .footer { height: 50px; width: 100%; background-color: #222; text-align: center; color: rgb(157, 157, 157); font-family: Arial; font-size: large; letter-spacing: 1px; line-height: 50px; } flex-header { /*background-color: lightblue;*/ } .flex-container{ /*background-color: lightgreen;*/ } .flex-footer { /*background-color: lightblue;*/ } .flex-center { display: flex; flex-direction: column; align-items: center; justify-content: center; } .flex-center-block { padding-right: 15px; padding-top: 15px; display: flex; align-items: center; justify-content: center; } .about{ padding-bottom: 15%; } .about-title { letter-spacing: 0.5em; font-family: "宋体"; font-weight: bold; } .about-content { font-size: large; padding: 0% 10%; line-height: 3em; letter-spacing: 0.1em; text-indent: 5% } ```
div css大神看一看求回答在线等
大神求帮忙啊,怎么能让第三个div那个绿框移动到顶端与企业文化那个导航栏对齐啊,不管我加display还是float都不能使他移到上边![图片](https://img-ask.csdn.net/upload/201612/13/1481599128_243972.png)![图片](https://img-ask.csdn.net/upload/201612/13/1481599321_675661.png)![图片](https://img-ask.csdn.net/upload/201612/13/1481599150_144453.png)
简单的关于左侧可隐藏收缩导航栏修改求助
附和我要求的采纳再加30c,急用求帮忙 1. 小弟初学网页求前辈们帮忙,应该是要加8行左右代码就行了 ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112613_482859.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432113046_900144.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112893_353806.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112907_191013.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112922_636493.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112939_112105.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112946_644784.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112954_745463.png) ![图片说明](https://img-ask.csdn.net/upload/201505/20/1432112963_111817.png) ``` <html><head> <STYLE type=text/css> BODY { MARGIN: 0px; FONT: 9pt 宋体 } TABLE { BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px } TD { FONT: 12px 宋体 } IMG { BORDER-RIGHT: 0px; BORDER-TOP: 0px; VERTICAL-ALIGN: bottom; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px } A { FONT: 12px 宋体; COLOR: #000000; TEXT-DECORATION: none } A:hover { COLOR: #215dc6 } .sec_menu { BORDER-RIGHT: #158BB7 1px solid; BACKGROUND: #ffffff; OVERFLOW: hidden; BORDER-LEFT:#158BB7 1px solid; BORDER-BOTTOM:#158BB7 1px solid } .list_title { } .list_title SPAN { FONT-WEIGHT: bold; LEFT: 8px; COLOR:#FFFFFF; POSITION: relative; TOP: 2px; visibility: visible; } .list_title2 { } .list_title2 SPAN { FONT-WEIGHT: bold; LEFT: 8px; COLOR: #ffffff; POSITION: relative; TOP: 2px } </STYLE> <SCRIPT language=javascript> function show(obj,maxg,obj2) { if(obj.style.pixelHeight<maxg) { obj.style.pixelHeight+=maxg/10; //obj.filters.alpha.opacity+=20; obj2.background="Img/back_11.gif"; if(obj.style.pixelHeight==maxg/10) obj.style.display='block'; myObj=obj; mymaxg=maxg; myObj2=obj2; setTimeout('show(myObj,mymaxg,myObj2)','5'); } } function hide(obj,maxg,obj2) { if(obj.style.pixelHeight>0) { if(obj.style.pixelHeight==maxg/5) obj.style.display='none'; obj.style.pixelHeight-=maxg/5; //obj.filters.alpha.opacity-=10; obj2.background="Img/back_08.gif"; myObj=obj; mymaxg=maxg myObj2=obj2; setTimeout('hide(myObj,mymaxg,myObj2)','5'); } else if(whichContinue) whichContinue.click(); } function chang(obj,maxg,obj2) { if(obj.style.pixelHeight) { hide(obj,maxg,obj2); nopen=''; whichcontinue=''; } else if(nopen) { whichContinue=obj2; nopen.click(); } else { show(obj,maxg,obj2); nopen=obj2; whichContinue=''; } } </SCRIPT> </head> <body leftmargin="0" topmargin="0" > <TABLE cellSpacing=0 cellPadding=0 width="100%" align=left border=0> <TBODY> <TR> <TD vAlign=top> <TABLE cellSpacing=0 cellPadding=0 width=145 align=center> <TBODY> <TR style="CURSOR: hand"> </TR></TBODY></TABLE> <SCRIPT language=javascript> var nopen=""; var whichContinue=''; </SCRIPT> <table align="center" background="Img/back_left_06.gif" border="0" cellpadding="0" cellspacing="0" height="453" width="163"> <tr> <td colspan="3" height="50"> &nbsp;</td> </tr> <tr> <td height="390" width="10"> &nbsp;</td> <td valign="top" width="146"> <TABLE cellSpacing=0 cellPadding=0 width=145 align=center> <TBODY> <TR style="CURSOR: hand"> <TD class=list_title id=list2 onmouseover="this.typename='list_title2';" onclick=chang(menu2,60,list2); onmouseout="this.typename='list_title';" background="Img/back_08.gif" height=25><SPAN>试题信息管理</SPAN> </TD> </TR> <TR> <TD align="center"> <DIV class=sec_menu id=menu2 style="DISPLAY: none; FILTER: alpha(Opacity=0); WIDTH: 145px; HEIGHT: 0px"> <TABLE cellSpacing=2 cellPadding=0 width=135 align=center> <TR> <TD height=25><a href=TExaminationInfo.aspx target="menu">□ 选择题试题信息</a></TD> </TR> <TR> <TD height=25><a href=TAddExamination.aspx target="menu">□ 添加选择题试题信息</a></TD> </TR> </TABLE> </DIV></TD></TR></TBODY></TABLE> <TABLE cellSpacing=0 cellPadding=0 width=145 align=center> <TBODY> <TR style="CURSOR: hand"> <TD class=list_title id=list4 onmouseover="this.typename='list_title2';" onclick=chang(menu4,30,list4); onmouseout="this.typename='list_title';" background="Img/back_08.gif" height=25><SPAN>考试结果管理</SPAN> </TD> </TR> <TR> <TD valign="middle"> <DIV class=sec_menu id=menu4 style="DISPLAY: none; FILTER: alpha(Opacity=0); WIDTH: 145px; HEIGHT: 0px"> <TABLE cellSpacing=2 cellPadding=0 width=135 align=center> <TBODY> <TR> <TD height=25><a href=TExaminationResult.aspx target="menu">□ 考试结果</a></TD> </TR> </TBODY> </TABLE> </DIV></TD> </TR> </TBODY> </TABLE> <TABLE cellSpacing=0 cellPadding=0 width=145 align=center style="height: 100px"> <TBODY> <TR style="CURSOR: hand"> <TD class=list_title id=list8 onmouseover="this.typename='list_title2';" onclick=chang(menu8,80,list8); onmouseout="this.typename='list_title';" background="Img/back_08.gif" height=25><SPAN>个人信息维护</SPAN> </TD> </TR> <TR> <TD valign="middle"> <DIV class=sec_menu id=menu8 style="FILTER: alpha(Opacity=100); WIDTH: 145px; HEIGHT:80px"> <TABLE cellSpacing=0 cellPadding=0 width=135 align=center> <TBODY> <TR> <TD height=30> <p style="line-height: 200%"> <a href=TeacherChangePwd.aspx target="menu">□ 修改密码</a></TD></TR> <TR> <TD height=30> <p style="line-height: 200%"> </TD></TR></TBODY></TABLE> <p class="sec_menu">&nbsp;</p> </DIV></TD></TR></TBODY></TABLE> </td> <td width="7"> &nbsp;</td> </tr> <tr> <td colspan="3" height="13"> &nbsp;</td> </tr> </table> </TABLE> </body> </html> ```
问个JSP网页DIV布局的问题
以前用过frameset布局,比如分成左,上,主 这样的三部分,左边是导航栏,点击相应的项目,主这个部分变化 如果我现在用DIV,怎么保证页面的一部分变化呢?就是菜单栏本身不变的,网页主体部分变了。 实在没什么概念,大家帮助下,谢谢了
请加大家一下html问题
首先 body{padding:0; margin:0;} 我遇到的问题是 导航栏的问题 ``` <div id="nav"> <ul> <li><a href="#">关于我们</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">关于于我于我于我于我于我于我于我于我于我于我于我于我于我于我于我我们</a></li> <li><a href="#">关于我们</a></li> </ul> </div> ``` css如下 ``` #nav ul{ width: 1000px; } #nav ul li{ line-height: 40px; display: block; height: 40px; float:left; width: 125px; text-align: center; } #nav ul li a{ text-decoration:none; color:white; } #nav ul li:hover{ background-color: #001931; } ``` 我想问下,为啥nav的总长是1000px,ul也是1000px; li是125px;正好8个li,为啥在nav中放不开?
相见恨晚的超实用网站
相见恨晚的超实用网站 持续更新中。。。
Java学习的正确打开方式
在博主认为,对于入门级学习java的最佳学习方法莫过于视频+博客+书籍+总结,前三者博主将淋漓尽致地挥毫于这篇博客文章中,至于总结在于个人,实际上越到后面你会发现学习的最好方式就是阅读参考官方文档其次就是国内的书籍,博客次之,这又是一个层次了,这里暂时不提后面再谈。博主将为各位入门java保驾护航,各位只管冲鸭!!!上天是公平的,只要不辜负时间,时间自然不会辜负你。 何谓学习?博主所理解的学习,它是一个过程,是一个不断累积、不断沉淀、不断总结、善于传达自己的个人见解以及乐于分享的过程。
程序员必须掌握的核心算法有哪些?
由于我之前一直强调数据结构以及算法学习的重要性,所以就有一些读者经常问我,数据结构与算法应该要学习到哪个程度呢?,说实话,这个问题我不知道要怎么回答你,主要取决于你想学习到哪些程度,不过针对这个问题,我稍微总结一下我学过的算法知识点,以及我觉得值得学习的算法。这些算法与数据结构的学习大多数是零散的,并没有一本把他们全部覆盖的书籍。下面是我觉得值得学习的一些算法以及数据结构,当然,我也会整理一些看过...
大学四年自学走来,这些私藏的实用工具/学习网站我贡献出来了
大学四年,看课本是不可能一直看课本的了,对于学习,特别是自学,善于搜索网上的一些资源来辅助,还是非常有必要的,下面我就把这几年私藏的各种资源,网站贡献出来给你们。主要有:电子书搜索、实用工具、在线视频学习网站、非视频学习网站、软件下载、面试/求职必备网站。 注意:文中提到的所有资源,文末我都给你整理好了,你们只管拿去,如果觉得不错,转发、分享就是最大的支持了。 一、电子书搜索 对于大部分程序员...
linux系列之常用运维命令整理笔录
本博客记录工作中需要的linux运维命令,大学时候开始接触linux,会一些基本操作,可是都没有整理起来,加上是做开发,不做运维,有些命令忘记了,所以现在整理成博客,当然vi,文件操作等就不介绍了,慢慢积累一些其它拓展的命令,博客不定时更新 free -m 其中:m表示兆,也可以用g,注意都要小写 Men:表示物理内存统计 total:表示物理内存总数(total=used+free) use...
比特币原理详解
一、什么是比特币 比特币是一种电子货币,是一种基于密码学的货币,在2008年11月1日由中本聪发表比特币白皮书,文中提出了一种去中心化的电子记账系统,我们平时的电子现金是银行来记账,因为银行的背后是国家信用。去中心化电子记账系统是参与者共同记账。比特币可以防止主权危机、信用风险。其好处不多做赘述,这一层面介绍的文章很多,本文主要从更深层的技术原理角度进行介绍。 二、问题引入 假设现有4个人...
python学习方法总结(内附python全套学习资料)
不要再问我python好不好学了 我之前做过半年少儿编程老师,一个小学四年级的小孩子都能在我的教学下独立完成python游戏,植物大战僵尸简单版,如果要肯花时间,接下来的网络开发也不是问题,人工智能也可以学个调包也没啥问题。。。。。所以python真的是想学就一定能学会的!!!! --------------------华丽的分割线-------------------------------- ...
兼职程序员一般可以从什么平台接私活?
这个问题我进行了系统性的总结,以下将进行言简意赅的说明和渠道提供,希望对各位小猿/小媛们有帮助~ 根据我们的经验,程序员兼职主要分为三种:兼职职位众包、项目整包和自由职业者驻场。 所谓的兼职职位众包,指的是需求方这边有自有工程师配合,只需要某个职位的工程师开发某个模块的项目。比如开发一个 app,后端接口有人开发,但是缺少 iOS 前端开发工程师,那么他们就会发布一个职位招聘前端,来配合公司一...
网页实现一个简单的音乐播放器(大佬别看。(⊙﹏⊙))
今天闲着无事,就想写点东西。然后听了下歌,就打算写个播放器。 于是乎用h5 audio的加上js简单的播放器完工了。 演示地点演示 html代码如下` music 这个年纪 七月的风 音乐 ` 然后就是css`*{ margin: 0; padding: 0; text-decoration: none; list-...
JAVA 基础练习题
第一题 1.查看以下代码,并写出结果 public class Test01 { public static void main(String[] args) { int i1 = 5; boolean result = (i1++ &gt; 5) &amp;&amp; (++i1 &gt; 4); System.out.println(result); Sy...
Python十大装B语法
Python 是一种代表简单思想的语言,其语法相对简单,很容易上手。不过,如果就此小视 Python 语法的精妙和深邃,那就大错特错了。本文精心筛选了最能展现 Python 语法之精妙的十个知识点,并附上详细的实例代码。如能在实战中融会贯通、灵活使用,必将使代码更为精炼、高效,同时也会极大提升代码B格,使之看上去更老练,读起来更优雅。
数据库优化 - SQL优化
以实际SQL入手,带你一步一步走上SQL优化之路!
2019年11月中国大陆编程语言排行榜
2019年11月2日,我统计了某招聘网站,获得有效程序员招聘数据9万条。针对招聘信息,提取编程语言关键字,并统计如下: 编程语言比例 rank pl_ percentage 1 java 33.62% 2 cpp 16.42% 3 c_sharp 12.82% 4 javascript 12.31% 5 python 7.93% 6 go 7.25% 7 p...
通俗易懂地给女朋友讲:线程池的内部原理
餐盘在灯光的照耀下格外晶莹洁白,女朋友拿起红酒杯轻轻地抿了一小口,对我说:“经常听你说线程池,到底线程池到底是个什么原理?”
C++知识点 —— 整合(持续更新中)
本文记录自己在自学C++过程中不同于C的一些知识点,适合于有C语言基础的同学阅读。如果纰漏,欢迎回复指正 目录 第一部分 基础知识 一、HelloWorld与命名空间 二、引用和引用参数 2.1引用的定义 2.2 将引用用作函数参数 2.3 将引用用于类对象 2.4 引用和继承 2.5 何时使用引用参数 2.6 引用和指针的区别 三、内联函数 四、默认参数的...
《奇巧淫技》系列-python!!每天早上八点自动发送天气预报邮件到QQ邮箱
将代码部署服务器,每日早上定时获取到天气数据,并发送到邮箱。 也可以说是一个小型人工智障。 知识可以运用在不同地方,不一定非是天气预报。
经典算法(5)杨辉三角
杨辉三角 是经典算法,这篇博客对它的算法思想进行了讲解,并有完整的代码实现。
Python实例大全(基于Python3.7.4)
博客说明: 这是自己写的有关python语言的一篇综合博客。 只作为知识广度和编程技巧学习,不过于追究学习深度,点到即止、会用即可。 主要是基础语句,如三大控制语句(顺序、分支、循环),随机数的生成,数据类型的区分和使用; 也会涉及常用的算法和数据结构,以及面试题相关经验; 主体部分是针对python的数据挖掘和数据分析,主要先攻爬虫方向:正则表达式匹配,常用数据清洗办法,scrapy及其他爬虫框架,数据存储方式及其实现; 最后还会粗略涉及人工智能领域,玩转大数据与云计算、进行相关的预测和分析。
腾讯算法面试题:64匹马8个跑道需要多少轮才能选出最快的四匹?
昨天,有网友私信我,说去阿里面试,彻底的被打击到了。问了为什么网上大量使用ThreadLocal的源码都会加上private static?他被难住了,因为他从来都没有考虑过这个问题。无独有偶,今天笔者又发现有网友吐槽了一道腾讯的面试题,我们一起来看看。 腾讯算法面试题:64匹马8个跑道需要多少轮才能选出最快的四匹? 在互联网职场论坛,一名程序员发帖求助到。二面腾讯,其中一个算法题:64匹...
面试官:你连RESTful都不知道我怎么敢要你?
干货,2019 RESTful最贱实践
机械转行java自学经历,零基础学java,血泪总结的干货
机械转行java自学经历,零基础学java,血泪总结的干货 据说,再恩爱的夫妻,一生中都有100次想离婚的念头和50次想掐死对方的冲动。 求职路上亦是如此,打开这篇文章,相信你也有转行的想法。和身边的朋友聊过,入职后的他们,或多或少对现在的职位都有些不满,都有过转行的冲动。 可他们只是想,而我真的这样做了。 下面就介绍下我转行的血泪史。 我为什么要转行 高中复读了一年,考了个双非院校的机械。当时...
刷了几千道算法题,这些我私藏的刷题网站都在这里了!
遥想当年,机缘巧合入了 ACM 的坑,周边巨擘林立,从此过上了"天天被虐似死狗"的生活… 然而我是谁,我可是死狗中的战斗鸡,智力不够那刷题来凑,开始了夜以继日哼哧哼哧刷题的日子,从此"读题与提交齐飞, AC 与 WA 一色 ",我惊喜的发现被题虐既刺激又有快感,那一刻我泪流满面。这么好的事儿作为一个正直的人绝不能自己独享,经过激烈的颅内斗争,我决定把我私藏的十几个 T 的,阿不,十几个刷题网...
为啥国人偏爱Mybatis,而老外喜欢Hibernate/JPA呢?
关于SQL和ORM的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行了一番讨论,感触还是有一些,于是就有了今天这篇文。 声明:本文不会下关于Mybatis和JPA两个持久层框架哪个更好这样的结论。只是摆事实,讲道理,所以,请各位看官勿喷。 一、事件起因 关于Mybatis和JPA孰优孰劣的问题,争论已经很多年了。一直也没有结论,毕竟每个人的喜好和习惯是大不相同的。我也看...
【Linux系统编程】Linux信号列表
00. 目录 文章目录00. 目录01. Linux信号编号02. 信号简介03. 特殊信号04. 附录 01. Linux信号编号 在 Linux 下,每个信号的名字都以字符 SIG 开头,每个信号和一个数字编码相对应,在头文件 signum.h 中,这些信号都被定义为正整数。信号名定义路径:/usr/include/i386-linux-gnu/bits/signum.h 要想查看这些信号和...
JavaScript 为什么能活到现在?
作者 | 司徒正美 责编 |郭芮 出品 | CSDN(ID:CSDNnews) JavaScript能发展到现在的程度已经经历不少的坎坷,早产带来的某些缺陷是永久性的,因此浏览器才有禁用JavaScript的选项。甚至在jQuery时代有人问出这样的问题,jQuery与JavaScript哪个快?在Babel.js出来之前,发明一门全新的语言代码代替JavaScript...
项目中的if else太多了,该怎么重构?
介绍 最近跟着公司的大佬开发了一款IM系统,类似QQ和微信哈,就是聊天软件。我们有一部分业务逻辑是这样的 if (msgType = "文本") { // dosomething } else if(msgType = "图片") { // doshomething } else if(msgType = "视频") { // doshomething } else { // doshom...
致 Python 初学者
欢迎来到“Python进阶”专栏!来到这里的每一位同学,应该大致上学习了很多 Python 的基础知识,正在努力成长的过程中。在此期间,一定遇到了很多的困惑,对未来的学习方向感到迷茫。我非常理解你们所面临的处境。我从2007年开始接触 python 这门编程语言,从2009年开始单一使用 python 应对所有的开发工作,直至今天。回顾自己的学习过程,也曾经遇到过无数的困难,也曾经迷茫过、困惑过。开办这个专栏,正是为了帮助像我当年一样困惑的 Python 初学者走出困境、快速成长。希望我的经验能真正帮到你
Python 编程开发 实用经验和技巧
Python是一门很灵活的语言,也有很多实用的方法,有时候实现一个功能可以用多种方法实现,我这里总结了一些常用的方法和技巧,包括小数保留指定位小数、判断变量的数据类型、类方法@classmethod、制表符中文对齐、遍历字典、datetime.timedelta的使用等,会持续更新......
借助AI力量,谷歌解开生命奥秘?
全文共4484字,预计学习时长8分钟 Paweł Czerwiński发布在 Unsplash上的原图 假如疾病不复存在会发生什么?如果我们能像大自然一样迅速获取能量又会发生什么?要是我们能够在极短时间内循环塑料、废油、或其它的一些物质呢?如果人类能够解开生命的奥秘,那么以上这些想象将在未来成为现实。人工智能企业DeepMind的数据科学分析师日前在此领域有了重大发现。以下为具体内容:...
吐血推荐珍藏的Visual Studio Code插件
作为一名Java工程师,由于工作需要,最近一个月一直在写NodeJS,这种经历可以说是一部辛酸史了。好在有神器Visual Studio Code陪伴,让我的这段经历没有更加困难。眼看这段经历要告一段落了,今天就来给大家分享一下我常用的一些VSC的插件。 VSC的插件安装方法很简单,只需要点击左侧最下方的插件栏选项,然后就可以搜索你想要的插件了。 下面我们进入正题 Material Theme ...
相关热词 c#中dns类 c#合并的excel c# implicit c#怎么保留3个小数点 c# 串口通信、 网络调试助手c# c# 泛型比较大小 c#解压分卷问题 c#启动居中 c# 逻辑或运算符
立即提问