草庐IT

1.1 仿百度Web Day1

Yiero 2023-03-28 原文

Day1

根据自己的垃圾html+css水平写出了下面这个页面:

首先, 首部的超链接都能够链接上, 但是不会[更多]的弹出窗口, 右面的天气/设置/个人也没有做, 不会怎么去调用

中间的图片和搜索栏能够正常使用, 搜索栏能够正常搜索. 但是无法水平垂直居中, 而且, 两个input无法靠近在一起.

下面的inframe新闻框不会写

最下面的footer正常使用.

源码

css

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin:0; padding:0; }
a {text-decoration: none;}

/* 顶部 */
#nav {
	margin: 20px;
}

#nav > a {
	color: black;
	margin: 10px;
}

#nav > a:hover {
	color: aqua;
}

/* 图片 */
.image1 {
	text-align: center;
}

/* 搜索栏 */
.search {
	text-align: center;
	line-height: height;
}

.search > form > input:first-child{
	border-radius: 10px;
	width: 700px;
	height: 30px;
	margin: 0;
	padding: 0;
}

.search > form > input:nth-child(2){
	background-color: blue;
	color: white;
	border-radius: 10px;
	width: 100px;
	height: 30px;
	margin: 0;
	padding: 0;
}



/* 底部 */
#footer {
	text-align: center;
	position: absolute;
	left: 0; bottom: 0; right: 0;
	margin: 10px;
}

#footer > * {
	font-size: 5px;
	color: gray;
	margin: 10px;
}

#footer > a:hover {
	color: black;
}

html

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<title>百度一下,你就知道</title>

	<link rel="stylesheet" href="./css/style.css">
</head>
<body>

	<!-- 顶部导航栏 -->
	<div id="nav">
		<a href="http://news.baidu.com/" target="_blank">新闻</a>
		<a href="https://www.hao123.com/?src=from_pc_logon" target="_blank">hao123</a>
		<a href="http://map.baidu.com/" target="_blank">地图</a>
		<a href="http://tieba.baidu.com/" target="_blank">贴吧</a>
		<a href="https://haokan.baidu.com/?sfrom=baidu-top" target="_blank">视频</a>
		<a href="http://image.baidu.com/" target="_blank">图片</a>
		<a href="https://pan.baidu.com/?from=1026962h" target="_blank">网盘</a>

		<a href="#" target="_blank">更多</a>
	</div>

	<!-- 图片 -->
	<div class="image1">
		<a href="https://www.baidu.com/s?wd=%E4%BA%8C%E5%8D%81%E5%A4%A7&sa=ire_dl_gh_logo_texing&rsv_dl=igh_logo_pc" target="_blank">
			<img src="https://www.baidu.com/img/pc_675fe66eab33abff35a2669768c43d95.png" alt="百度搜索" title="二十大" style="zoom:50%">
		</a>
	</div>

	<!-- 搜索栏 -->
	<div class="search">
		<form action="https://cn.bing.com/search" method="get">
			<input type="text" name="q" >
			<input type="submit" value="百度一下">
		</form>
	</div>

	<!-- 底层栏 -->
	<div id="footer">
		<a href="https://home.baidu.com/" target="_blank">关于百度</a>
		<a href="http://ir.baidu.com/" target="_blank">About Baidu</a>
		<a href="https://www.baidu.com/duty" target="_blank">使用百度前必读</a>
		<a href="https://help.baidu.com/" target="_blank">帮助中心</a>
		<a href="https://e.baidu.com/?refer=1271" target="_blank">企业推广</a>
		<a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11000002000001" target="_blank">京公网安备11000002000001号</a>
		<a href="https://beian.miit.gov.cn/" target="_blank">京ICP证030173号</a>
		<a href="https://www.baidu.com/licence/" target="_blank">信息网络传播视听节目许可证 0110516</a>
		<span>互联网宗教信息服务许可证编号:京(2022)0000043</span>
	</div>

</body>
</html>

有关1.1 仿百度Web Day1的更多相关文章

  1. ruby-on-rails - Rake 文档 :app fails after upgrading to Ruby 2. 1.1 和 Rails 4.1 - 2

    我使用命令rakedoc:app为我的Rails应用程序生成一些基本文档。它在过去一直运行良好。昨天我通过应用程序从Ruby1.9.3升级到2.1.1,从Rails3.2升级到4.1。该应用程序一切正常,所以几周后我第一次重新生成文档,但失败了。我运行上面的命令并收到以下错误消息:rakeaborted!Don'tknowhowtobuildtask'README.rdoc'/home/vagrant/.rvm/gems/ruby-2.1.1/bin/ruby_executable_hooks:15:in`eval'/home/vagrant/.rvm/gems/ruby-2.1.1/

  2. win10系统下Edge浏览器搜索引擎[必应]和新建标签页被篡改百度的一种解决方式 - 2

    一、我的情况:win10系统下Edge浏览器搜索引擎[必应]和新建标签页被篡改百度的搜索引擎和百度的页面我的解决方案步骤如下:1.检查电脑管家的浏览器保护检查一下你的电脑是否后台开启了电脑管家;如果是,则检查一下是否开启了浏览器保护。由于我是联想的笔记本,自带联想管家,一直没有关闭过它,以我的电脑为例,进行关闭,如下图所示。其他的电脑管家软件,应该也有类似的功能,耐心找一下就能找到啦。2.在Edge浏览中进行相关设置先点击浏览器右上角的三个点,然后找到“设置”,然后进入设置界面。在当前页面手动搜索“搜索引擎”,然后选择需要的搜索引擎“必应”,然后点击管理搜索引擎。进入管理搜索引擎界面后,理论上

  3. javascript - Echarts3(百度)工具提示中的彩色圆形 - 2

    Echarts3(baidu)工具提示中的彩色圆形默认情况下,工具提示具有与图形相同颜色的圆形,如下所示:http://echarts.baidu.com/gallery/editor.html?c=candlestick-brush但是,如果我自定义工具提示,它会像本例中那样删除颜色编码的圆形:https://ecomfe.github.io/echarts/doc/example/tooltip.html#-en有没有办法使用自定义工具提示并将颜色放回原处。这是另一种解释方式。转到此链接pie-simple并且您会发现没有彩色圆形的图表。删除以下行:formatter:"{a}{b

  4. 最新!AI第一次有了国家标准,北大、华为、百度等单位共同编制 - 2

    最近,国家标准全文公开系统网站正式发布了国家标准《神经网络表示与模型压缩第一部分:卷积神经网络》(GB/T42382.1-2023),此标准由北京大学、鹏城实验室、华为、百度等16家单位共同编制。(来源:全国标准信息公共服务平台)英文标准名称:Informationtechnology—Neuralnetworkrepresentationandmodelcompression—Part1:Convolutionalneuralnetwork,将于2023年10月1日正式实施,这是国内首个面向人工智能(AI)模型表示与压缩技术的国家标准。最关键的是,这一标准的制定与推进采用了特殊的国际国内“两

  5. 百度松果 泡泡 (数组模拟 TLE) - 2

    题目描述小码哥一开始吹出的泡泡被母体记为1,2,。。。,n,而泡泡的碰撞融合实际是数字的拼接(有序)。母体会通过模拟得知两个泡泡环碰撞的情况(用x->y表示)例如,有一个为1-2的泡泡环与3-4-5的泡泡环碰撞,碰撞的点为1->4(后一个数字接在前一个数字下面),则会形成1-4-5-3-2的泡泡环一开始所有泡泡环都只有一个数字,母体演算出了泡泡之后的碰撞点,现在请你输出泡泡碰撞完后的所有泡泡的情况。输入格式第一行两个正整数n,m,表示一开始泡泡的数量和泡泡碰撞的次数接下来m行,每行两个数字x,y,表示泡泡碰撞的两个点输出格式输出所有泡泡的情况,一行表示一个泡泡的情况要求按照字典序最小的方式按顺

  6. UE5.1.1创建C++工程失败解决办法 - 2

    闲来无事,更新了一下UE5.1.1,妈蛋创建C++项目居然失败,错误截图如下:妈蛋,后面一堆乱码,鬼知道是啥错误!咋解决?步步高打火机,直接复制第一段的Running后面的代码到cmd中执行。这下看的懂了,‘dotnet’不是内部或外部命令,也不是可运行的程序一般出现xxx不是内部外部命令都是没有设置环境变量。找到5.1.1的目录下的Engine/Build/BatchFiles/Build.bat就调用一个同级目录下的GetDotnetPath.bat的文件,再次找到并打开GetDotnetPath.batGG,原来就是将引擎安装目录下的Dotnet指定到PATH中。再打开电脑的系统环境变量

  7. json - 更新 1.1 在文件夹中运行 Go 文件和 JSON 文件时出现问题 - 2

    更新1.1在收到有关更改处理程序路径的有用反馈后,我在我的应用程序中使用了该反馈,但奇怪的是,我仍然收到一些错误反馈。我正在尝试自己弄清楚,但我想我可以与大家分享。这也是我取消现在给出的答案的原因。还有一些答案现在让我感到困惑,无法理解这将如何为我工作。packagemainimport("net/http"//PackagehttpprovidesHTTPclientandserverimplementations.)funcmain(){webHost()}funcwebHost(){//Ikhebhierlaternogeenmapjevoordehtmlpagina'stoeg

  8. go - 为什么 int64(1.1*float64(time.Minute)) 是错误而 int64(0.5*float64(time.Minute)) 不在 golang 1.9.2 中? - 2

    我在golang1.9.2中遇到了一个非常奇怪的错误:当我尝试编写int64(1.1*float64(time.Minute))时显示错误。编译器说常量被截断为整数。但是当我将1.1更改为其他float(如1.20.51.7)时,它会编译!而且当我这样写的时候它也可以编译:value:=1.1*float64(time.Minute)fmt.Println(int64(value))这是go本身的一些错误吗?我在ubuntu14.04x64上运行go 最佳答案 常量1.1*float64(time.Minute)有小数部分(值大约为

  9. go - 如何强制客户端使用 http/2? (而不是退回到 http 1.1) - 2

    我如何强制一个简单的Go客户端使用HTTP/2并防止它退回到HTTP1.1?我有一个简单的HTTP/2服务器在“本地主机”上运行,它在回复中返回请求的详细信息。以下是使用GoogleChrome浏览器对此URL的输出:https://localhost:40443/bananasIlikebananas!Method=GETURL=/bananasProto=HTTP/2.0Host=localhost:40443RequestURI=/bananas但这是我为我的Go客户端代码得到的。你可以看到它回落到HTTP1.1Ilikemonkeys!Method=GETURL=/monkey

  10. xml - 将 XMLDocument 转换为数据集 ASP.Net 1.1 - 2

    我需要在ASP.Net中将XMLDocument转换为DataSet。我不想将XMLData保存到任何物理位置。 最佳答案 您可以使用xmlDocument类读取xml文件并将数据保存到数据集。Hereisanexample关于如何使用xmlDocument读取XML文件。这段代码很旧。没试过XmlDocumentxdoc=MethodReturnsXmlDocument();//转换为数据集DataSetds=newDataSet();ds.ReadXml(新的XmlNodeReader(xdoc));Here是你的另一个例子。

随机推荐