程序员经验分享-hwhale

HTML+CSS简易淘宝页面

2023-11-08

效果图

在这里插入图片描述

效果图中的图片可以去我微信公众号新白者，回复照片就行

HTML代码

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>淘宝界面</title>
		<link href="./js/text.css" rel="stylesheet" type="text/css">/* 注意这个外部链接引入css的名字与自己的相同*/
	</head>
	<body>
		<div id="top">
			<div id="top1">
				<div style="float: right;">
					<a href="#" style="color: red;">登录</a>
					<a href="#">免费注册</a>
				</div>
				<div style="left: ;">
					<a href="#" style="red">淘宝网首页</a>
					<a href="#">我的淘宝</a>
					<a href="#">购物车</a>
					<a href="#">收藏夹</a>
					<a href="#">商品分类</a>
					<a href="#">卖家中心</a>
					<a href="#">联系客服</a>
					<a href="#">网站导航</a>
				</div>
			</div>
			<div id="top2">
				<!--分为两个div，都向左浮动，搜索框部分注意调整左外边距与顶外边距的距离 -->
				<div style="float: left; margin-left: 10px;">
					<img width="200"height="200" src="taobao.jpg" /></div>
				<div style="float: left; margin-left: 100px;"></div>
				<!--搜索框和搜索框下面的文字拆分为连个标签部分，由于统一居中，所以搜索框需要进行重定位-->
				<div style="margin-top: 20px; text-align: center;">
					<input type="text" name="search" style="width: 500px; height: 25px; border: 1px solid gray; outline: none; border-radius: 2px;" />
					<input type="submit" value="搜 索" />
				</div>
			</div>
		</div>

		<div id="top3">
			您是不是想找：<a href="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=java&oq=java%25E7%259A%2584%25E4%25B9%25A6%25E7%259A%2584%25E5%259B%25BE%25E7%2589%2587&rsv_pq=91586ea8000f388d&rsv_t=1b27dyIUD80Mv6idKg%2BqvN7elbq2D23P9ogQs5niN22j7%2Bvpr8JztTe8eXY&rqlang=cn&rsv_enter=0&rsv_dl=tb&inputT=1020&rsv_sug3=25&rsv_sug1=4&rsv_sug7=000&prefixsug=java&rsp=0&rsv_sug4=1868&rsv_sug=1">Java</a> | <a href="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=Python&oq=java&rsv_pq=fedb592000108aa3&rsv_t=82f9psouOGQRARKhvwxlDNY7LP4sl1qUgHYqPWuLbX2TZIanmdw%2FBAb2akc&rqlang=cn&rsv_enter=0&rsv_dl=tb&inputT=5685&rsv_sug3=31&rsv_sug1=7&rsv_sug7=100&prefixsug=Python&rsp=0&rsv_sug4=5685">Python</a> | <a href="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=C%2B%2B&oq=Python&rsv_pq=c26c05fa000fc243&rsv_t=0071gts0XNYLSoFMrY8Pn4yTjMcQ4UZNvT5t4doLAnGnj%2FuEzlwqMJK8XEg&rqlang=cn&rsv_enter=0&rsv_dl=tb&inputT=8777&rsv_sug3=34&rsv_sug1=9&rsv_sug7=100&rsv_sug4=8777">C++</a> | <a href="https://www.baidu.com/s?ie=utf-8&f=3&rsv_bp=1&rsv_idx=1&tn=baidu&wd=javascript&oq=html&rsv_pq=90f52314000a4fe1&rsv_t=ea6fWneLZaouNhRkKrqhhmSbg3ItqJdeHjeO9mrZy2AQDmo0TsFp%2BgFcFLA&rqlang=cn&rsv_enter=0&rsv_dl=ts_2&inputT=4066&rsv_sug3=42&rsv_sug1=13&rsv_sug7=100&rsv_sug2=0&prefixsug=Java&rsp=2&rsv_sug4=4066&rsv_sug=2">JavaScript</a> | <a href="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=html&oq=%2526lt%253B%252B%252B&rsv_pq=902c22b9000c0d60&rsv_t=84dcsxDVv4IX4yp7OcEVpKLJGoj8u0xDUAH79S3ub11Kqh6ZOFEMGblcDeE&rqlang=cn&rsv_enter=0&rsv_dl=tb&inputT=8453&rsv_sug3=38&rsv_sug1=11&rsv_sug7=100&rsv_sug4=8453&rsv_sug=1">html</a>
		</div>
		<!--顶部第四部分-->
		<div id="top4" style="margin-top: 3px;">
			<!--同样分为了两个部分-->
			<div style="float: left;">
				价格： <input type="text" name="price1" /> - <input type="text" name="price2" />
			</div>
			<div style="float: right">
				<input type="checkbox" name="ck1" value="1" />
				包邮
				<input type="checkbox" name="ck1" value="2" />
				消协
				<input type="checkbox" name="ck1" value="3" />
				品质
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			</div>
		</div>
		</div>
		<!--主体部分（商品展示，这里使用表格）-->
		<div id="main">
			<!--表格，宽度与浏览器宽度一致，列控制每列的宽度，复制后自适应数量-->
			<table width="100%">
				<!--两行五列-->
				<tr align="center">
					<td>
						<a href="https://s.taobao.com/search?q=java%E7%BC%96%E7%A8%8B%E6%80%9D%E6%83%B3&imgfile=&commend=all&ssid=s5-e&search_type=item&sourceId=tb.index&spm=a21bo.2017.201856-taobao-item.1&ie=utf8&initiative_id=tbindexz_20170306">
						<img src="./img/java.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 75.6 包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.9</p>
					</td>
					<td>
						<a href="https://s.taobao.com/search?ie=utf8&initiative_id=staobaoz_20200331&stats_click=search_radio_all%3A1&js=1&imgfile=&q=spring%E6%8F%AD%E7%A7%98+%E7%8E%8B%E7%A6%8F%E5%BC%BA&suggest=0_1&_input_charset=utf-8&wq=Spring%E6%8F%AD%E7%A7%98&suggest_query=Spring%E6%8F%AD%E7%A7%98&source=suggest">
						<img src="./img/Spring.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 268.5 包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>

					</td>


					<td> 
					<a href="https://s.taobao.com/search?q=Python%E7%BC%96%E7%A8%8B&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
						<img src="./img/download%20(1).jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 69.8 包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
					<td> 
					<a href="https://s.taobao.com/search?q=python%E6%B8%B8%E6%88%8F%E7%BC%96%E7%A8%8B%E5%BF%AB%E9%80%9F%E4%B8%8A%E6%89%8B&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
					<img src="download2.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 53.21包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
					<td> 
					<a href="https://s.taobao.com/search?q=%E7%A8%8B%E5%BA%8F%E8%AE%BE%E8%AE%A1%E6%8A%80%E6%9C%AF%E4%B8%8EC%2B%2B%E8%AF%AD%E8%A8%80%E7%AE%80%E6%98%8E%E6%95%99%E7%A8%8B&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
						<img src="img/C++1.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 7.65包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
				</tr>
				<tr align="center">
					<td>
						<a href="https://s.taobao.com/search?q=C%2B%2B%E7%A8%8B%E5%BA%8F%E8%AE%BE%E8%AE%A1%E5%8E%9F%E7%90%86%E4%B8%8E%E5%AE%9E%E7%8E%B0&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
						<img src="img/C++2.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 73.3 包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
					<td>
						<a href="https://s.taobao.com/search?q=JavaScript%E7%8A%80%E7%89%9B&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
						<img src="img/Js1.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 84.9包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>

					</td>


					<td> <a href="https://s.taobao.com/search?q=JavaScriptES6%E5%87%BD%E6%95%B0&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
					<img src="img/js2.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 31.8 包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
					<td> <a href="https://s.taobao.com/search?q=HtmL5%2BCss3+Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E6%8A%80%E6%9C%AF&imgfile=&js=1&stats_click=search_radio_all%3A1&initiative_id=staobaoz_20200331&ie=utf8">
					<img src="img/HTML.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 42.35 包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
					<td> <a href="https://item.taobao.com/item.htm?spm=a230r.1.14.83.61dc51313f9b7k&id=613939505977&ns=1&abbucket=16#detail">
					<img src="img/HTML2.jpg" width="150px" /></a><br />
						<!--&yen表示人民币-->
						<p style="color: orange;">&yen 82包邮</p>
						<p>世界上最好的商品</p>
						<p style="color: gray;">>图书专卖店</p>
						<p style="color: gray;" align="right">如实描述4.8</p>
					</td>
				</tr>
	</body>
</html>

CSS代码

/*全局选择器，控制字体大小统一     */
* {
	font-size: 14px;
}

#top {
	width: 1000px;
	height: 220px;
	margin: 0 auto;
}

#main {
	width: 1000px;
	height: 500px;
	margin: 0 auto;
}

/* a标签显示了超链接，这里采用鼠标hover显示下划线的效果*/
#top1 a {
	color: black;
	text-decoration: none;
}

#top1 a:hover {
	text-decoration: underline;
	/*鼠标放上去显示下划线*/
}

/*top1的a与top3的a不同这里分别处理*/
#top3 a {
	color: black;
	/*字体颜色黑色，由于文字都用a标签包裹，这里只能通过a标签精准调节，注意优先级*/
	text-decoration: none;
	/*下划线去掉*/
}

#top3 a:hover {
	text-decoration: underline;
	/*鼠标放上去显示下划线*/
}

/*分配top1、top2和top3全局*/
#top1 {
	height: 30px;
	border-radius: 5px;
	background-color: red;
	text-indent: 2em;
	/*文字缩进2字符*/
	line-height: 30px;
	/*背景框高度是30px，所以这里也是写30，保证居中*/
}

#top2 {
	height: 100px;
	margin-top: 10px;
}

#top3 {
	height: 30px;
	border-radius: 5px;;
	background-color: red;
	text-indent: 2em;
	line-height: 30px;
}

#top4 {
	height: 40px;
	border-radius: 5px;
	border: 1px solid gainsboro;
	/*实心框线*/
	line-height: 40px;
	text-indent: 2em;
}

/*主体部分全局控制*/
#main table p {
	font-size: 12px;
	line-height: 5px;
	/*控制行间距，也可以直接控制p标签的margin*/
	margin-bottom: 0;
	/*p标签自带的有外边距，这里需要将底部的margin去除，将外框和该标签底部的间距消除*/
}

#main table td {
	border: 1px solid gainsboro;
	padding: 10px;
	/*内边距，图片文字距离父容器的距离*/
	border-radius: 5px;
}
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

js

HTML+CSS简易淘宝页面 的相关文章

  • 求二叉树中两个指定节点的最短距离

    给定一个二叉树 找到该树中两个指定节点间的最短距离 思路 求最近公共祖先节点 然后再求最近公共祖先节点到两个指定节点的路径 再求两个节点的路径之和 const shortestDistance function root p q let l

  • VUE项目中的全局格式化时间过滤器

    自定义格式化时间 一 问题 这是一个后台管理系统中的商品列表页 其中的时间这一项在调用接口后会发现是以毫秒来计算的 这样当然是不行的啦 要换算成我们日常使用的2020 04 07 17 13 这样的时间格式 二 解决办法 1 打开项目中的m

  • js删除数组里的某个元素

    删除数组中的某个元素 首先需要确定需要删除元素的索引值 var arr 1 5 6 12 453 324 function indexOf val for var i 0 i lt arr length i if arr i val ret

  • 【每日一练】79—CSS实现扫描二维码动画

    二维码的应用越来越普通 加个好友 付个款 做个核酸 想去一个地方 还要扫个场所码 总之 需要二维码的地方越来越多 因此 在这样的大环境里 如何让你的码与众不同 引人注意 就显得非常重要 今天我们就来练习一个二维码的动画效果 具体效果如下 看

  • 元字符的详细解析

    上一篇文章介绍了正则的用处以及正则中这些元字符的基本含义 但是如果我们只知道那些元字符的含义 不知道怎么使用和加以练习 那么对于正则我们还只是看见了门槛 并没有踏入 那么本篇文章就让我们迈起脚步正式走入正则的世界吧 let s go 我的学

  • js制作简单的轮播图

    实现原理 首先定义一个div 设置width和height 然后在这个div里面再定义一个div2 该div的宽度为父div的宽度的n倍 其中n表示图片的张数 在这个div2里面放置需要进行轮播的所有图片 设置每张图片的宽度为一个最外层父类

  • VUE 移动端只获取当前拍摄照片,不允许相册获取 及 input标签capture属性详解

    一 VUE移动端简单实现只获取当前拍摄照片demo

  • JS 变量提升和函数提升

    变量提升 这里介绍一个变量提升提升的经典案例 for var i 0 i lt 10 i setTimeout gt console log i 1000 这里打印是10个10 因为在执行第一个setTimeout时 Js不会等待1秒后再去

  • [Vue warn]: Error in render: “TypeError: cellValue.replaceAll is not a function

    去除中括号 如 车门 车门 let reg new RegExp g return str replaceAll reg 上面方法 在edge浏览器 谷歌浏览器没问题 但是在搜狗和QQ浏览器就报错 解决办法 return str repla

  • postMan使用技巧

    使用postMan调试接口 一些接口要实现登录才能访问 即要还token才能访问 一般登录后 拿到token才复制到其他接口下添加token变量 如些复制感觉是挺麻烦的 这时我们可以设置postman的全局变量 操作如下 添加调试环境和全局

  • js-年月日时分秒字符串切割,只显示年月日

    substring 方法用于提取字符串中介于两个指定下标之间的字符 var date 2020 01 01 00 00 00 date substring 0 10 console log date 2020 01 01

  • Umi+Dva初印象＜基础应用，结构，流转逻辑＞

    目录 前言 知识储备 generator函数 Dva初识 实际交互 函数式组件 class组件 前言 项目初始为umi脚手架进行初始化 lt 初始化过程 http t csdn cn cuTaY gt 工程中加载了umi自带的antd ui

  • JS声明二维数组常见办法

    JS声明二维数组常见办法 目录 文章目录 前言 new Array 和 fill fill 灵活插入 for 笨办法 Array from 前言 目前论坛常见的办法代码质量奇差 因此针对这个问题进行整理 new Array和fill con

  • setTimeout异步

    同步任务和异步任务 同步和异步操作的区别就是是否阻碍后续代码的执行 同步任务是那些没有被引擎挂起 在主线程上排队执行的任务 只有前一个任务执行完毕 才能执行后一个任务 异步任务是那些被引擎放在一边 不进入主线程 而进入任务队列的任务 只有引

  • 网页是如何显示在浏览器

    这两天学习了一些网页如何在浏览器中显示的知识 感觉在我向前端走的路上非常有用 所以就在这里总结一下 大家可以看看 我也算是巩固一下知识 因为自己学识太浅 内容可能有一些错误之处 希望看到的朋友可以指出来啦 在Edge浏览器也加入Chromi

  • 通过点击按钮在页面添加图片

    点击添加按钮 在盒子中加入图片 点击图片实现删除图片效果 代码如下

  • JS修改对象属性的值

    当对象以数字为属性名时 其实就是一个数组 用 var foo 1 a 2 b foo 1 c console log foo 1 c 2 b 当对象以字符为属性名时 直接用 获取属性值 var bar a 1 b 2 c 3 bar a h

  • JavaScript 分支结构语句

    JavaScript 分支结构语句 1 if语句 2 if else语句 双分支语句 3 if else if 语句 多分支语句 4 三元表达式 5 switch语句 语句 也称为流控制语句 通常使用一或多个关键字完成既定的任务 语句可以简

  • js 对数组对象进行排序

    let listData id 1 name 测试1 presenttime 1557883600000 id 2 name 测试2 presenttime 1580751813000 id 3 presenttime 1561448381

  • vue2项目实现excel文件导入导出和拖拽上传

    文章目录 一 excle文件导出 二 excel文件导入 三 文件拖拽上传 四 完整代码 文件导入导出实现逻辑图 一 excle文件导出 导出员工接口返回的是二进制流 axios配置responseType为blob接收二进制流文件为Blo

随机推荐

  • JavaScript——将json数组填充进excel表并下载保存

    今天遇到的一个问题就是 获取到猫眼电影票房总榜的数据后 怎么把他们填充进excel中 本文参考了另一篇博客 地址如下 https blog csdn net qq 34623560 article details 79928248 本文对其

  • flowable(九) 通过ui部署流程图

    下载xml模型 登陆到flowable modeler后台 上传部署 登陆flowable admin地址 ok

  • React基础（肆）———状态和循环渲染

    一 状态 什么是状态 import React Component from react export default class App extends Component state mytext 收藏 myShow true rend

  • 问题 C: 括号匹配

    题目描述 给你一个字符串 里面只包含 四种符号 请问你需要至少添加多少个括号才能使这些括号匹配起来 如 是匹配的 是匹配的 是不匹配的 是不匹配的 输入 第一行输入一个正整数N 表示测试数据组数 N lt 10 每组测试数据都只有一行 是一

  • 调试最长的一帧（第14天）

    看看流程 可见分页数据库的更新也是和场景的筛选绘制是同时进行的 再看看大图 第14天要进行左下角的 依照惯例 跟过去 现在开始步入正轨 发现第0个fileName为空 这是有问题的 创建pagelod时修正为 这次进来了 在这里删除 放入r

  • HTML5+CSS3D酷炫相册

    HTML5 CSS3D酷炫相册 图片预览 目录结构 源码 HTML

  • 2：数据结构复习线性表（一般集合的并集：链式解决方案）

    线性表的合并 例2 1 求解一般集合的并集问题 问题描述 已知两个集合A和B 现要求一个新的集合A AUB 例如 设 A 7 5 3 11 B 2 6 3 合并后 A 7 5 3 11 2 6 问题分析 可以利用两个线性表LA和LB分别表示

  • 数组最大连续子序列和

    题目 给定一个数组 其中元素可正可负 求其中最大连续子序列的和 这题是一道非常经典的面试题 会经常出现在各种面试中 具体有好几种不同时间复杂度的解法 那么最好的方法是用动态规划方法来求解 第一种 时间复杂度为O n 3 暴力法求解 三层循环

  • events.js:183 throw er; // Unhandled 'error' event 相关问题解决办法

    在启动项目的时候可能会出现以下问题 出现原因 出现这个问题的主要原因是因为端口被占用了 解决办法 查询端口号是否被占用 netstat aon findstr 8000 找到对应程序 tasklist findstr 9060 再任务管理器

  • 2015款Mac笔记本安装Windows10系统到外置移动硬盘教程

    终于把2015年的15寸Macbook Pro笔记本安装上了Windows10操作系统 并且是在外置的移动硬盘上安装的 运行的效果和用户体验也是非常棒 之前网上购买了加密的视频 但是这个视频必须是windows系统 还不能是虚拟机里面的系统

  • QT关键问题解决之paintevent理解

    基础概念 paintEvent QPaintEvent 函数是QWidget类中的虚函数 用于ui的绘制 会在多种情况下被其他函数自动调用 比如update 时 运行时机 一个重绘事件用来重绘一个部件的全部或者部分区域 下面几个原因的任意一

  • 中移动 NB-IoT （M5310-A）学习笔记

    一 来自 M5310 A硬件设计手册V1 5 DCE Data Communication EquipmentDTE Data Terminal Equipment 模块的三种工作模式 模式 描述 Active 模块处于活动状态 所有功能正

  • CreateFile之类的几个函数

    这几天看windows API一日一练 博主给画出了道道 我来填填具体点的内容 需求 想操作文件 串口 并口 USB等等 原理层 其实很简单 就三步 打开 操作 然后关闭 实践层1 打开用CreateFile 读写操作用WriteFile

  • 宝塔面板部署nginx+springboot+netty

    nginx配置集成netty的springboot前后端分离项目 项目环境 CentOS 7 9 宝塔面板 nginx1 21 前后端分离项目按照日常部署方式部署到服务器 前往nginx配置文件nginx conf 配置TCP socket

  • 两台机器之间同步时间，并修改服务器层级

    作业a 第一台机器从阿里云同步时间 第二台机器从第一台机器同步时间 第一台机器配置 vim etc chrony conf 修改第一台机器的配置文件 将原有的pool注释掉 并添加阿里云时钟源 gt server ntp aliyun co

  • C++实现两个字符串交替组合成一个字符串

    引言 这道题来自力扣 给出两个字符串 将两个字符串交替着组合成一个字符串 如 string str1 abcd string str2 hb string str ahbbcd string str1 abcd string str2 hb

  • kafka高性能设计：内存池

    前言 Kafka的内存池是一个用于管理内存分配的缓存区域 它通过在内存上保留一块固定大小的内存池 用于分配消息缓存 批处理缓存等对象 以减少频繁调用内存分配函数的开销 Kafka内存池的实现利用了Java NIO中的 ByteBuffer

  • 罗技键盘连计算机,罗技键盘怎么连接电脑

    罗技蓝牙键盘连接电脑需装入电池 打开电源开关 转动拨盘至 1 位置 然后长按 PC 键3秒进入 搜索 模式 打开电脑 前往 设置 设备 蓝牙和其他设备 打开 蓝牙 在蓝牙搜索列表中选中罗技蓝牙键盘的名称 确认配对即可完成连接 本文以惠普光影

  • 搭建tcp客户端，双进程实现tcp服务端客户端随时收发，udp服务端客户端

    tcp客户端 include

  • HTML+CSS简易淘宝页面

    效果图 效果图中的图片可以去我微信公众号新白者 回复照片就行 HTML代码 注意这个外部链接引入css的名字与自己的相同 div div div a a div div div

热门标签