CSS的一个小案例——模拟soso搜搜导航器

CSS中最常用的个人认为是链接方式，即外部连接。通常刚学习的小白，容易忘记在头部中加link标签，比如我，我用的时候，容易忘记写，所以，在使用外部连接方式时一定先把link标签写上。

html源代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>模仿SOSO搜搜</title><link rel="stylesheet" href="Example2.css">
</head>
<body>
<div id="big">
<!--1.图片--><div align="center"><img src="img/SOSO.jpg" alt="" ></div>
<!--2.连接--><div class="div"><ul><li id="h"></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><li><a href="#">新闻</a></li><li><a href="#">地图</a></li><li id="more"><a href="#">更多&gt;&gt;</a></li></ul><p style="height: 44px">&nbsp;</p></div>
<!--3.表单--><div id="s"><form action="#" id="flg" name="flg"><input  type="text" value=""><input type="submit" value="搜搜"></form></div>
</div>
</body>
</html>

源代码

*{margin: 0;padding: 0;
}
p{margin: 0;padding: 0;
}
#div{margin: 0 auto;font-size: 12px;padding: 0;border-bottom: 1px solid #00c;background: #EEE;width: 800px;height: 18px;
}
div li a{display: block;text-decoration: underline;padding: 4px 0 0 0;margin: 0;font-size: 13px;
}
div li{float: left;list-style-type: none;margin: 0;padding: 0;width: 40px;
}
div li a:link,div li a:visited{color: #004276;
}
div li#h{width: 400px;height: 18px;
}#s{background-color: #006eb8;width: 430px;height: 40px;margin: 0 auto;
}
form{display: block;padding-left: 120px;padding-top: 15px;
}
#big{width: 1200px;
}

CSS的一个小案例——模拟soso搜搜导航器相关推荐

Python:通过一个小案例深入理解IO多路复用
通过一个小案例深入理解IO多路复用假如我们现在有这样一个普通的需求,写一个简单的爬虫来爬取校花网的主页 import requests import timestart = time.time()u ...
一个小案例理解case穿透、switch语句
一.用case穿透简化代码以一个小案例为例:键盘录入星期数,输出工作日.休息日(1-5)工作日,(6-7)休息日 package test;import java.util.Scanner;publi ...
用一个小案例来解释linux中文件或目录的权限
Linux中文档和目录的权限众所周知 , Linux中文档的权限包括所有者权限(User).同组权限(Group)和其他权限(Other).使用rwx来作为表示,分别为read.write和exec ...
爬虫的一个小案例:python实现英汉互译
什么是网络爬虫? 网络爬虫又称网络蜘蛛,是指按照某种规则在网络上爬取所需内容的脚本程序.众所周知,每个网页通常包含其他网页的入口,网络爬虫则通过一个网址依次进入其他网址获取所需内容. 一个小案例:py ...
用一个小故事模拟Spring-Aop(三)--Advice适配器
Advice&Advisor 承接上文上文最终使用的例子如下 public class ImitateApplication {public static void main(String[ ...
一个小案例精通lamda表达式与函数式接口
前言:只有基础(多态.匿名接口实现类)足够扎实才能更好的学习花拳绣腿(lamda表达式),Lambda 表达式,也可称为闭包,它是推动 Java 8 发布的最重要新特性.Lambda 允许把函数作为一 ...
基于jQuery发射弹幕的一个小案例
一.直接上代码 1.style样式: <style type="text/css">html, body {margin: 0px;padding: 0px;width ...
分享一个小案例，用HMS Scankit做一个安卓扫码购小应用
前言随着消费升级,零售业逐渐迈入新的发展阶段,"新零售"现象:消费者在货架前扫描小程序二维码,一边逛一边扫描条形码下单,等选好要买的东西,直接拿出手机,通过"扫码购&q ...
python爬取网页教程（一个小案例分享）
一.为什么需要用爬虫? 为其他程序提供数据源,如搜索引擎(百度.Google等).数据分析.大数据等等. 二.python爬虫设计思路 1.首先确定需要爬取的网页URL地址 : 2.通过HTTP协议来 ...

CSS的一个小案例——模拟soso搜搜导航器

CSS的一个小案例——模拟soso搜搜导航器相关推荐

最新文章

热门文章