HTML5和CSS3简单介绍

一、html5新标签：

创新互联建站是一家专注于成都做网站、成都网站建设与策划设计,高唐网站建设哪家好?创新互联建站做网站,专注于网站建设十载,网设计领域的专业建站公司;建站业务涵盖:高唐等地区。高唐做网站价格咨询:18980820575

HTML5中必须在开头写有的标签

(1)

	定义 article。

定义 article。

(2)

	定义页面内容之外的内容。

定义页面内容之外的内容。

(3)

	定义声音内容。

定义声音内容。

autoplay	autoplay	如果出现该属性，则音频在就绪后马上播放。
controls	controls	如果出现该属性，则向用户显示控件，比如播放按钮。
loop	loop	如果出现该属性，则每当音频结束时重新开始播放。
preload	preload	如果出现该属性，则音频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。
src	url	要播放的音频的 URL。

(4)

	定义 section。

定义 section。

(5)

	定义下拉列表。

定义下拉列表。

eg：

需注意的是，input标签list属性中的值必须与下面datalist中id的值一致，表单才可呈现。

(6)

	定义元素的细节。

定义元素的细节。

(7)

	定义媒介内容的分组，以及它们的标题。

定义媒介内容的分组，以及它们的标题。

(8)

</td><td>定义 textarea。</td></tr></tbody></table><p>(9)</p><p> </p><table class="dataintable"><tbody><tr><td class="html5_new"><video></td><td>定义视频。</td></tr></tbody></table><p><video>标签的属性：</p><table class="dataintable"><tbody><tr><td class="html5_new">autoplay</td><td>autoplay</td><td>如果出现该属性，则视频在就绪后马上播放。</td></tr><tr><td class="html5_new">controls</td><td>controls</td><td>如果出现该属性，则向用户显示控件，比如播放按钮。</td></tr><tr><td class="html5_new">height</td><td><em>pixels</em></td><td>设置视频播放器的高度。</td></tr><tr><td class="html5_new">loop</td><td>loop</td><td>如果出现该属性，则当媒介文件完成播放后再次开始播放。</td></tr><tr><td class="html5_new">preload</td><td>preload</td><td><p>如果出现该属性，则视频在页面加载时进行加载，并预备播放。</p><p>如果使用 "autoplay"，则忽略该属性。</p></td></tr><tr><td class="html5_new">src</td><td><em>url</em></td><td>要播放的视频的 URL。</td></tr><tr><td class="html5_new">width</td><td><em>pixels</em></td><td>设置视频播放器的宽度。</td></tr></tbody></table><p>(10)</p><table class="dataintable"><tbody><tr><td class="html5_new"><progress></td><td>定义任何类型的任务的进度。</td></tr></tbody></table><p> </p><p><strong>二、CSS 3：</strong></p><p>（1）新增选择器：</p><table width="590" cellspacing="0" cellpadding="0"><tbody><tr><td width="83" class="kso3"><p>E:link</p></td><td width="170" class="kso4"><p>链接伪类选择器</p></td><td width="336" class="kso5"><p>设置超链接a在未被访问前的样式。</p></td></tr><tr><td width="83" class="kso9"><p>E:hover</p></td><td width="170" class="kso10"><p>用户操作伪类选择器</p></td><td width="336" class="kso11"><p>设置元素在其鼠标悬停时的样式。</p></td></tr><tr><td width="83" class="kso12"><p>E:active</p></td><td width="170" class="kso13"><p>用户操作伪类选择器</p></td><td width="336" class="kso14"><p>设置元素在被用户激活（在鼠标点击与释放之间发生的事件）时的样式。</p></td></tr><tr><td width="83" class="kso15"><p>E:focus</p></td><td width="170" class="kso16"><p>用户操作伪类选择器</p></td><td width="336" class="kso17"><p>设置元素在成为输入焦点（该元素的onfocus事件发生）时的样式。</p></td></tr></tbody></table><p> </p><table width="510" cellspacing="0" cellpadding="0"><tbody><tr><td width="85" class="kso4"><p>E F</p></td><td width="121" class="kso5"><p>包含选择符</p></td><td width="322" class="kso7"><p>选择所有被E元素包含的F元素。</p></td></tr><tr><td width="85" class="kso8"><p>E>F</p></td><td width="121" class="kso9"><p>子选择符</p></td><td width="322" class="kso11"><p>选择所有作为E元素的子元素F。</p></td></tr><tr><td width="85" class="kso12"><p>E+F</p></td><td width="121" class="kso13"><p>相邻选择符</p></td><td width="322" class="kso15"><p>选择紧贴在E元素之后F元素。</p></td></tr><tr><td width="85" class="kso16"><p>E~F</p></td><td width="121" class="kso17"><p>兄弟选择符</p></td><td width="322" class="kso19"><p>选择E元素所有兄弟元素F。</p></td></tr></tbody></table><p> </p><table width="575" cellspacing="0" cellpadding="0"><tbody><tr><td width="192" class="kso18"><p>E:nth-last-child(n)</p></td><td width="399" class="kso20"><p>匹配父元素的倒数第n个子元素E。</p></td></tr><tr><td width="192" class="kso30"><p>E:nth-of-type(n)</p></td><td width="399" class="kso32"><p>匹配同类型中的第n个同级兄弟元素E。</p></td></tr><tr><td width="192" class="kso33"><p>E:nth-last-of-type(n)</p></td><td width="399" class="kso35"><p>匹配同类型中的倒数第n个同级兄弟元素E。</p></td></tr><tr><td width="192" class="kso36"><p>E:empty</p></td><td width="399" class="kso38"><p>匹配没有任何子元素（包括text节点）的元素E。</p></td></tr></tbody></table><p> </p><table width="596" cellspacing="0" cellpadding="0"><tbody><tr><td width="110" class="kso3"><p>E:checked</p></td><td width="94" class="kso4"><p>CSS3</p></td><td width="391" class="kso5"><p>匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)</p></td></tr></tbody></table><p> </p><p>E、F代表任何标签，后面是给标签添加的相关属性，用来做出相应的效果。</p><p> (2)css中的box属性：</p><table width="0" class="dataintable"><tbody><tr><td>overflow-x</td><td>如果内容溢出了元素内容区域，是否对内容的左/右边缘进行裁剪。</td></tr><tr><td>overflow-y</td><td>如果内容溢出了元素内容区域，是否对内容的上/下边缘进行裁剪。</td></tr><tr><td>overflow-style</td><td>规定溢出元素的首选滚动方法。</td></tr></tbody></table><p>其中overflow属性有</p><p> </p><table width="0" class="dataintable"><tbody><tr><td>visible</td><td>不裁剪内容，可能会显示在内容框之外。</td></tr><tr><td>hidden</td><td>裁剪内容 - 不提供滚动机制。</td></tr><tr><td>scroll</td><td>裁剪内容 - 提供滚动机制。</td></tr><tr><td>auto</td><td>如果溢出框，则应该提供滚动机制。</td></tr><tr><td>no-display</td><td>如果内容不适合内容框，则删除整个框。</td></tr><tr><td>no-content</td><td>如果内容不适合内容框，则隐藏整个内容。</td></tr></tbody></table><p> </p><p>（3）css中的多背景及背景的属性：</p><p><strong>多背景：</strong></p><p><strong><img src="/upload/otherpic46/211282.jpg" alt="HTML5和CSS3简单介绍"></strong></p><p>其中图片1在2的上面，2在3的上面。</p><p>在background中，如果想要的放置多张图片，只需用“ ，”将图片的url依次放入，但请记住，图层在上的必须要最先放入。图片的尺寸也可以写在一起，前面的数值为宽，后的数值为高。</p><p><strong> 属性：</strong></p><p>（1）</p><table class="dataintable"><tbody><tr><td>background-p_w_upload</td><td>设置背景图像是否固定或者随着页面的其余部分滚动。</td></tr></tbody></table><p>其中backg-p_w_upload中的属性还有</p><table class="dataintable"><tbody><tr><td>scroll</td><td>默认值。背景图像会随着页面其余部分的滚动而移动。</td></tr><tr><td>fixed</td><td>当页面的其余部分滚动时，背景图像不会移动。</td></tr><tr><td>inherit</td><td>规定应该从父元素继承 background-p_w_upload 属性的设置。</td></tr></tbody></table><p>（2）渐变效果：</p><p>线性渐变</p><p>background：linear-gradient（方向，颜色1，颜色2，....）</p><p>其中方向可以用to left（right），角度来写。</p><p>径向渐变</p><p>background：radius-gradient（位置，颜色1，颜色2，...）</p><p> </p><p> </p><p>（4）多序排列：</p><p> </p><table width="0" class="dataintable"><tbody><tr><td>column-count</td><td>规定元素应该被分隔的列数。</td></tr><tr><td>column-gap</td><td>规定列之间的间隔。</td></tr><tr><td>column-rule</td><td>分隔线</td></tr><tr><td>column-span</td><td>规定元素应该横跨的列数。</td></tr><tr><td>column-width</td><td>规定列的宽度。</td></tr><tr><td>columns</td><td>规定设置 column-width 和 column-count 的简写属性。</td></tr></tbody></table><p> </p><p>其中</p><p>column-count后面写需要的列数</p><p>column-gap后面写相隔的像素大小</p><p>column-rule后面写线性，粗细，颜色（分隔线）</p><p>column-width后面写想分的宽度</p><p>（5）响应式图片（根据浏览器窗口的大小调整照片的大小）</p><p>限大：max-width:比例（100%）/像素/height：auto</p><p>限小：min-width:像素大小</p><p> </p><p> </p><p> </p> <br> 新闻名称：HTML5和CSS3简单介绍 <br> 分享URL：<a href="http://dzwzjz.com/article/ipsege.html">http://dzwzjz.com/article/ipsege.html</a> </div> </div> <div class="othernews"> <h3>其他资讯</h3> <div class="othernews_list"> <ul> <li> <a href="/article/piohdp.html">PHP如何实现web缓存技术</a> </li><li> <a href="/article/piohos.html">springboot开发单体webshop中MybatisGenerator如何生成commonmapper</a> </li><li> <a href="/article/piohde.html">阿联酋的科技野心：AI或将成为新“石油”</a> </li><li> <a href="/article/piohog.html">python类指的是什么</a> </li><li> <a href="/article/pioppi.html">Docker容器的常见命令有哪些</a> </li> </ul> </div> </div> </div> </div> <div class="footer"> <div class="footer_content"> <div class="footer_content_top clear"> <div class="content_top_share fl"> <div><img src="/Public/Home/img/logo.png"></div> <div class="top_share_content"> <dd>分享至：</dd> <dt class="bdsharebuttonbox clear" id="share"> <a href="#" class="bds_tsina iconfont fl" data-cmd="tsina" title="分享到新浪微博"></a> <a href="#" class="bds_sqq iconfont fl" data-cmd="sqq" title="分享到QQ好友"></a> <a href="#" class="bds_weixin iconfont fl" data-cmd="weixin" title="分享到微信"></a> <a href="#" class="bds_weixin iconfont fl" data-cmd="tieba" title="分享到贴吧"></a> </dt> <script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName('head')[0]\|\|body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script> </div> </div> <div class="content_top_left fl clear"> <div class="top_left_list fl"> <dd><a href="/about/">关于我们</a></dd> <dt> <a href="/about/#gsjj">公司简介</a> <a href="/about/#fzlc">发展历程</a> </dt> </div> <div class="top_left_list fl"> <dd><a href="/service/">服务项目</a></dd> <dt> <a href="/service/">高端网站建设</a> <a href="/miniprogram/">小程序开发</a> <a href="/service/app.html">APP开发</a> <a href="/service/yingxiao.html">网络营销</a> </dt> </div> <div class="top_left_list fl"> <dd><a href="/jianzhan/">建站知识</a></dd> <dt> <a href="/jianzhan/">行业新闻</a> <a href="/jianzhan/">建站学堂</a> <a href="/jianzhan/">常见问题</a> </dt> </div> <div class="top_left_list fl"> <dd><a href="/contact/">联系我们</a></dd> <dt> <a href="/contact/#lxwm">公司地址</a> <a href="/contact/#rczp">人才招聘</a> </dt> </div> </div> <div class="content_top_right addressR fr"> <div class="top_right_title addressf_title"> <a href="javascript:;" class="on">成都</a> <a href="javascript:;">达州</a> </div> <div class="top_right_content addressf"> <div class="right_content_li on"> <div class="right_content_list clear"> <dd class="fl iconfont"></dd> <dt class="fl">电话：028-86922220</dt> </div> <div class="right_content_list clear"> <dd class="fl iconfont"></dd> <dt class="fl">地址：成都市太升南路288号锦天国际A幢1002号</dt> </div> </div> <div class="right_content_li"> <div class="right_content_list clear"> <dd class="fl iconfont"></dd> <dt class="fl">电话：028-86922220</dt> </div> <div class="right_content_list clear"> <dd class="fl iconfont"></dd> <dt class="fl">地址：达州市南岸区弹子石腾龙大道58号2栋21-6</dt> </div> </div> </div> </div> </div> <div class="link"> 友情链接： <a href="https://www.cdxwcx.com/jifang/wenjiang.html" title="温江服务器租用" target="_blank">温江服务器租用</a> <a href="https://www.cdcxhl.cn/ " title="虚拟主机" target="_blank">虚拟主机</a> <a href="https://www.cdcxhl.com/ssl/chengdu.html" title="SSL认证" target="_blank">SSL认证</a> <a href="http://www.cdfuwuqi.com/jigui/" title="服务器机柜" target="_blank">服务器机柜</a> <a href="http://www.cdxwcx.cn/sheji/" title="企业网站设计" target="_blank">企业网站设计</a> <a href="https://www.cdcxhl.com/gaiban/" title="网站改版" target="_blank">网站改版</a> <a href="http://www.scmwjz.com/" title="网站建设开发" target="_blank">网站建设开发</a> <a href="https://www.cdcxhl.com/ssl/https.html" title="ssl证书申请" target="_blank">ssl证书申请</a> <a href="http://www.4006tel.net/vision/website.html" title="网站设计" target="_blank">网站设计</a> <a href="http://m.xwcx.net/wechat/" title="成都微信二次开发公司" target="_blank">成都微信二次开发公司</a> </div> </div> <div class="footer_content_copyright clear">版权所有：青羊区大橙子信息咨询工作室 <a href="http://beian.miit.gov.cn/" rel="nofollow" target="_blank">蜀ICP备2022028542号-14</a> </div> </div> <!--浮窗--> <div class="FloatingWindow clear"> <a href="tencent://message/?uin=1683211881&Site=&Menu=yes" class="FloatingWindow_list fr"> <div class="FloatingWindow_list_title"> <dd class="iconfont"></dd> <dt><span>在线</span>咨询</dt> </div> </a> <a href="javascript:;" class="FloatingWindow_list fr"> <div class="FloatingWindow_list_title"> <dd class="iconfont"></dd> <dt>服务热线</dt> </div> <div class="FloatingWindow_list_down fadeInRight animated">服务热线：028-86922220</div> </a> <a href="javascript:;" class="FloatingWindow_list fr STop"> <div class="FloatingWindow_list_title"> <dd class="iconfont"></dd> <dt>TOP</dt> </div> </a> </div> <script src="/Public/Home/js/jquery-1.8.3.min.js"></script> <script src="/Public/Home/js/comm.js"></script> <script src="/Public/Home/js/wow.js"></script> <script src="/Public/Home/js/common.js"></script> </body> </html> <script> $(".cont img").each(function(){ var src = $(this).attr("src"); //获取图片地址 var str=new RegExp("http"); var result=str.test(src); if(result==false){ var url = "https://www.cdcxhl.com"+src; //绝对路径 $(this).attr("src",url); } }); window.onload=function(){ document.oncontextmenu=function(){ return false; } } </script>

</td><td>定义 textarea。</td></tr></tbody></table><p>(9)</p><p> </p><table class="dataintable"><tbody><tr><td class="html5_new"><video></td><td>定义视频。</td></tr></tbody></table><p><video>标签的属性：</p><table class="dataintable"><tbody><tr><td class="html5_new">autoplay</td><td>autoplay</td><td>如果出现该属性，则视频在就绪后马上播放。</td></tr><tr><td class="html5_new">controls</td><td>controls</td><td>如果出现该属性，则向用户显示控件，比如播放按钮。</td></tr><tr><td class="html5_new">height</td><td><em>pixels</em></td><td>设置视频播放器的高度。</td></tr><tr><td class="html5_new">loop</td><td>loop</td><td>如果出现该属性，则当媒介文件完成播放后再次开始播放。</td></tr><tr><td class="html5_new">preload</td><td>preload</td><td><p>如果出现该属性，则视频在页面加载时进行加载，并预备播放。</p><p>如果使用 "autoplay"，则忽略该属性。</p></td></tr><tr><td class="html5_new">src</td><td><em>url</em></td><td>要播放的视频的 URL。</td></tr><tr><td class="html5_new">width</td><td><em>pixels</em></td><td>设置视频播放器的宽度。</td></tr></tbody></table><p>(10)</p><table class="dataintable"><tbody><tr><td class="html5_new"><progress></td><td>定义任何类型的任务的进度。</td></tr></tbody></table><p> </p><p><strong>二、CSS 3：</strong></p><p>（1）新增选择器：</p><table width="590"  cellspacing="0" cellpadding="0"><tbody><tr><td width="83" class="kso3"><p>E:link</p></td><td width="170" class="kso4"><p>链接伪类选择器</p></td><td width="336" class="kso5"><p>设置超链接a在未被访问前的样式。</p></td></tr><tr><td width="83" class="kso9"><p>E:hover</p></td><td width="170" class="kso10"><p>用户操作伪类选择器</p></td><td width="336" class="kso11"><p>设置元素在其鼠标悬停时的样式。</p></td></tr><tr><td width="83" class="kso12"><p>E:active</p></td><td width="170" class="kso13"><p>用户操作伪类选择器</p></td><td width="336" class="kso14"><p>设置元素在被用户激活（在鼠标点击与释放之间发生的事件）时的样式。</p></td></tr><tr><td width="83" class="kso15"><p>E:focus</p></td><td width="170" class="kso16"><p>用户操作伪类选择器</p></td><td width="336" class="kso17"><p>设置元素在成为输入焦点（该元素的onfocus事件发生）时的样式。</p></td></tr></tbody></table><p> </p><table width="510"  cellspacing="0" cellpadding="0"><tbody><tr><td width="85" class="kso4"><p>E F</p></td><td width="121" class="kso5"><p>包含选择符</p></td><td width="322" class="kso7"><p>选择所有被E元素包含的F元素。</p></td></tr><tr><td width="85" class="kso8"><p>E>F</p></td><td width="121" class="kso9"><p>子选择符</p></td><td width="322" class="kso11"><p>选择所有作为E元素的子元素F。</p></td></tr><tr><td width="85" class="kso12"><p>E+F</p></td><td width="121" class="kso13"><p>相邻选择符</p></td><td width="322" class="kso15"><p>选择紧贴在E元素之后F元素。</p></td></tr><tr><td width="85" class="kso16"><p>E~F</p></td><td width="121" class="kso17"><p>兄弟选择符</p></td><td width="322" class="kso19"><p>选择E元素所有兄弟元素F。</p></td></tr></tbody></table><p> </p><table width="575"  cellspacing="0" cellpadding="0"><tbody><tr><td width="192" class="kso18"><p>E:nth-last-child(n)</p></td><td width="399" class="kso20"><p>匹配父元素的倒数第n个子元素E。</p></td></tr><tr><td width="192" class="kso30"><p>E:nth-of-type(n)</p></td><td width="399" class="kso32"><p>匹配同类型中的第n个同级兄弟元素E。</p></td></tr><tr><td width="192" class="kso33"><p>E:nth-last-of-type(n)</p></td><td width="399" class="kso35"><p>匹配同类型中的倒数第n个同级兄弟元素E。</p></td></tr><tr><td width="192" class="kso36"><p>E:empty</p></td><td width="399" class="kso38"><p>匹配没有任何子元素（包括text节点）的元素E。</p></td></tr></tbody></table><p> </p><table width="596"  cellspacing="0" cellpadding="0"><tbody><tr><td width="110" class="kso3"><p>E:checked</p></td><td width="94" class="kso4"><p>CSS3</p></td><td width="391" class="kso5"><p>匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)</p></td></tr></tbody></table><p> </p><p>E、F代表任何标签，后面是给标签添加的相关属性，用来做出相应的效果。</p><p> (2)css中的box属性：</p><table width="0" class="dataintable"><tbody><tr><td>overflow-x</td><td>如果内容溢出了元素内容区域，是否对内容的左/右边缘进行裁剪。</td></tr><tr><td>overflow-y</td><td>如果内容溢出了元素内容区域，是否对内容的上/下边缘进行裁剪。</td></tr><tr><td>overflow-style</td><td>规定溢出元素的首选滚动方法。</td></tr></tbody></table><p>其中overflow属性有</p><p> </p><table width="0" class="dataintable"><tbody><tr><td>visible</td><td>不裁剪内容，可能会显示在内容框之外。</td></tr><tr><td>hidden</td><td>裁剪内容 - 不提供滚动机制。</td></tr><tr><td>scroll</td><td>裁剪内容 - 提供滚动机制。</td></tr><tr><td>auto</td><td>如果溢出框，则应该提供滚动机制。</td></tr><tr><td>no-display</td><td>如果内容不适合内容框，则删除整个框。</td></tr><tr><td>no-content</td><td>如果内容不适合内容框，则隐藏整个内容。</td></tr></tbody></table><p> </p><p>（3）css中的多背景及背景的属性：</p><p><strong>多背景：</strong></p><p><strong><img src="/upload/otherpic46/211282.jpg" alt="HTML5和CSS3简单介绍"></strong></p><p>其中图片1在2的上面，2在3的上面。</p><p>在background中，如果想要的放置多张图片，只需用“ ，”将图片的url依次放入，但请记住，图层在上的必须要最先放入。图片的尺寸也可以写在一起，前面的数值为宽，后的数值为高。</p><p><strong> 属性：</strong></p><p>（1）</p><table class="dataintable"><tbody><tr><td>background-p_w_upload</td><td>设置背景图像是否固定或者随着页面的其余部分滚动。</td></tr></tbody></table><p>其中backg-p_w_upload中的属性还有</p><table class="dataintable"><tbody><tr><td>scroll</td><td>默认值。背景图像会随着页面其余部分的滚动而移动。</td></tr><tr><td>fixed</td><td>当页面的其余部分滚动时，背景图像不会移动。</td></tr><tr><td>inherit</td><td>规定应该从父元素继承 background-p_w_upload 属性的设置。</td></tr></tbody></table><p>（2）渐变效果：</p><p>线性渐变</p><p>background：linear-gradient（方向，颜色1，颜色2，....）</p><p>其中方向可以用to left（right），角度来写。</p><p>径向渐变</p><p>background：radius-gradient（位置，颜色1，颜色2，...）</p><p> </p><p> </p><p>（4）多序排列：</p><p> </p><table width="0" class="dataintable"><tbody><tr><td>column-count</td><td>规定元素应该被分隔的列数。</td></tr><tr><td>column-gap</td><td>规定列之间的间隔。</td></tr><tr><td>column-rule</td><td>分隔线</td></tr><tr><td>column-span</td><td>规定元素应该横跨的列数。</td></tr><tr><td>column-width</td><td>规定列的宽度。</td></tr><tr><td>columns</td><td>规定设置 column-width 和 column-count 的简写属性。</td></tr></tbody></table><p> </p><p>其中</p><p>column-count后面写需要的列数</p><p>column-gap后面写相隔的像素大小</p><p>column-rule后面写线性，粗细，颜色（分隔线）</p><p>column-width后面写想分的宽度</p><p>（5）响应式图片（根据浏览器窗口的大小调整照片的大小）</p><p>限大：max-width:比例（100%）/像素/height：auto</p><p>限小：min-width:像素大小</p><p> </p><p> </p><p> </p>            
            
                            <br>
                新闻名称：HTML5和CSS3简单介绍                <br>
                分享URL：<a href="http://dzwzjz.com/article/ipsege.html">http://dzwzjz.com/article/ipsege.html</a>
            </div>
        </div>
        <div class="othernews">
            <h3>其他资讯</h3>
            <div class="othernews_list">
                <ul>
                    <li>
                            <a href="/article/piohdp.html">PHP如何实现web缓存技术</a>
                        </li><li>
                            <a href="/article/piohos.html">springboot开发单体webshop中MybatisGenerator如何生成commonmapper</a>
                        </li><li>
                            <a href="/article/piohde.html">阿联酋的科技野心：AI或将成为新“石油”</a>
                        </li><li>
                            <a href="/article/piohog.html">python类指的是什么</a>
                        </li><li>
                            <a href="/article/pioppi.html">Docker容器的常见命令有哪些</a>
                        </li>                </ul>
            </div>
        </div>
    </div>
</div>

<div class="footer">
    <div class="footer_content">
        <div class="footer_content_top clear">
            <div class="content_top_share fl">
                <div><img src="/Public/Home/img/logo.png"></div>
                <div class="top_share_content">
                    <dd>分享至：</dd>
                    <dt class="bdsharebuttonbox clear" id="share">
                        <a href="#" class="bds_tsina iconfont fl" data-cmd="tsina" title="分享到新浪微博"></a>
                        <a href="#" class="bds_sqq iconfont fl" data-cmd="sqq" title="分享到QQ好友"></a>
                        <a href="#" class="bds_weixin iconfont fl" data-cmd="weixin" title="分享到微信"></a>
                        <a href="#" class="bds_weixin iconfont fl" data-cmd="tieba" title="分享到贴吧"></a>
                    </dt>
                    <script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
                </div>
            </div>
            <div class="content_top_left fl clear">
                <div class="top_left_list fl">
                    <dd><a href="/about/">关于我们</a></dd>
                    <dt>
                        <a href="/about/#gsjj">公司简介</a>
                        <a href="/about/#fzlc">发展历程</a>
                    </dt>
                </div>
                <div class="top_left_list fl">
                    <dd><a href="/service/">服务项目</a></dd>
                    <dt>
                        <a href="/service/">高端网站建设</a>
                        <a href="/miniprogram/">小程序开发</a>
                        <a href="/service/app.html">APP开发</a>
                        <a href="/service/yingxiao.html">网络营销</a>
                    </dt>
                </div>
                <div class="top_left_list fl">
                    <dd><a href="/jianzhan/">建站知识</a></dd>
                    <dt>
                        <a href="/jianzhan/">行业新闻</a>
                        <a href="/jianzhan/">建站学堂</a>
                        <a href="/jianzhan/">常见问题</a>
                    </dt>
                </div>
                <div class="top_left_list fl">
                    <dd><a href="/contact/">联系我们</a></dd>
                    <dt>
                        <a href="/contact/#lxwm">公司地址</a>
                        <a href="/contact/#rczp">人才招聘</a>
                    </dt>
                </div>
            </div>
            <div class="content_top_right addressR fr">
                <div class="top_right_title addressf_title">
                    <a href="javascript:;" class="on">成都</a>
                    <a href="javascript:;">达州</a>
                </div>
                <div class="top_right_content addressf">
                    <div class="right_content_li on">
                        <div class="right_content_list clear">
                            <dd class="fl iconfont"></dd>
                            <dt class="fl">电话：028-86922220</dt>
                        </div>
                        <div class="right_content_list clear">
                            <dd class="fl iconfont"></dd>
                            <dt class="fl">地址：成都市太升南路288号锦天国际A幢1002号</dt>
                        </div>
                    </div>
                    <div class="right_content_li">
                        <div class="right_content_list clear">
                            <dd class="fl iconfont"></dd>
                            <dt class="fl">电话：028-86922220</dt>
                        </div>
                        <div class="right_content_list clear">
                            <dd class="fl iconfont"></dd>
                            <dt class="fl">地址：达州市南岸区弹子石腾龙大道58号2栋21-6</dt>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="link">
            友情链接：
            <a href="https://www.cdxwcx.com/jifang/wenjiang.html" title="温江服务器租用" target="_blank">温江服务器租用</a>   <a href="https://www.cdcxhl.cn/
" title="虚拟主机" target="_blank">虚拟主机</a>   <a href="https://www.cdcxhl.com/ssl/chengdu.html" title="SSL认证" target="_blank">SSL认证</a>   <a href="http://www.cdfuwuqi.com/jigui/" title="服务器机柜" target="_blank">服务器机柜</a>   <a href="http://www.cdxwcx.cn/sheji/" title="企业网站设计" target="_blank">企业网站设计</a>   <a href="https://www.cdcxhl.com/gaiban/" title="网站改版" target="_blank">网站改版</a>   <a href="http://www.scmwjz.com/" title="网站建设开发" target="_blank">网站建设开发</a>   <a href="https://www.cdcxhl.com/ssl/https.html" title="ssl证书申请" target="_blank">ssl证书申请</a>   <a href="http://www.4006tel.net/vision/website.html" title="网站设计" target="_blank">网站设计</a>   <a href="http://m.xwcx.net/wechat/" title="成都微信二次开发公司" target="_blank">成都微信二次开发公司</a>           </div>
    </div>
    <div class="footer_content_copyright clear">版权所有：青羊区大橙子信息咨询工作室
        <a href="http://beian.miit.gov.cn/" rel="nofollow" target="_blank">蜀ICP备2022028542号-14</a>
    </div>
</div>

<div class="FloatingWindow clear">
    <a href="tencent://message/?uin=1683211881&Site=&Menu=yes" class="FloatingWindow_list fr">
        <div class="FloatingWindow_list_title">
            <dd class="iconfont"></dd>
            <dt><span>在线</span>咨询</dt>
        </div>
    </a>
    <a href="javascript:;" class="FloatingWindow_list fr">
        <div class="FloatingWindow_list_title">
            <dd class="iconfont"></dd>
            <dt>服务热线</dt>
        </div>
        <div class="FloatingWindow_list_down fadeInRight animated">服务热线：028-86922220</div>
    </a>
    <a href="javascript:;" class="FloatingWindow_list fr STop">
        <div class="FloatingWindow_list_title">
            <dd class="iconfont"></dd>
            <dt>TOP</dt>
        </div>
    </a>
</div>

大橙子网站建设，新征程启航

HTML5和CSS3简单介绍