border | 易学教程

无缝滚动

阅读更多关于无缝滚动

无缝滚动好像是互联网广告最大的一个载体，可以用“无处不在”来形容它。不过它比起早期的闪光字体，浮动广告算进步了。由于需求巨大，做前台迟早会遇到它。我先给出结构层部分，再慢慢讲解其实现原理。 01. < dl id = "marquee" > 02. < dt > 03. < img src = " http://images.cnblogs.com/cnblogs_com/rubylouvre/199042/o_s017.jpg " alt = "无缝滚动" /> 04. < img src = " http://images.cnblogs.com/cnblogs_com/rubylouvre/199042/o_s018.jpg " alt = "无缝滚动" /> 05. < img src = " http://images.cnblogs.com/cnblogs_com/rubylouvre/199042/o_s019.jpg " alt = "无缝滚动" /> 06. < img src = " http://images.cnblogs.com/cnblogs_com/rubylouvre/199042/o_s020.jpg " alt = "无缝滚动" /> 07. < img src = " http://images.cnblogs.com/cnblogs_com

全球疫情发布图

阅读更多关于全球疫情发布图

一、要求：　　我们有的是热情、激情、无限的动力，清明三天放假休息，为了纪念牺牲的烈士，我们集体决定仿照约翰·霍普金斯大学制作全球疫情发布图（WEB版），可以实时访问。行动起来吧。随时抽查，今天工作八小时。二、我的全球疫情发布图：三、设计思路： 1、准备数据：使用python从网页上爬取数据，并存入mysql数据库。 1）全球数据爬取： import requests import json from pymysql import * import requests from retrying import retry headers = {"User-Agent": "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Mobile Safari/537.36" ,"Referer": "https://wp.m.163.com/163/page/news/virus_report/index.html?_nw_=1&_anw_=1"} def _parse_url(url): response = requests.get(url,headers=headers,timeout=3) #3秒之后返回

css盒子模型

阅读更多关于 css盒子模型

盒子模型　　盒子模型就是把HTML 页面中的元素看作是一个矩形的盒子，也就是一个盛装盒子的容器，每个矩形都是由元素的内容、内边距（padding）、边距（border）和外边距（margin）组成。 <div>标记　　 div是英文 division 的缩写，意为“分割、区域”。<div>是一个区块容器标记，可以将网页分割为独立的、不同的部分，以实现网页的规划和布局。大多数 HTML 标签都可以嵌套在 <div> 中，<div> 中还可以嵌套多层<div>。盒子的宽与高边框属性设置内容样式属性常用属性边框样式 border-style:上边[右边下边左边]; none 无（默认）、solid 单实线、dashed 虚线、dotted 点线、double 双实线边框宽度 border-width:上边[右边下边左边]; 像素值边框颜色 border-color:上边[右边下边左边]; 颜色值、#十六进制、rgb(r%,g%,b%) 综合设置边框 border:四边宽度四边样式四边颜色圆角边框 border-radius:水平半径参数/垂直半径参数；像素值或百分比图片边框 border-images:图片路径裁切方式/边框宽度/边框扩展距离重复方式; 1.边框样式（border-style）　　其基本语法格式：border-style

前端三贱客 -- CSS

阅读更多关于前端三贱客 -- CSS

CSS（Cascading Style Sheets）给你的html页面穿上衣服让其看起来性感，美观。 css选择器类选择器  <style type="text/css"> .cl{ background-color: blue; width: 200px; position: absolute; left: 0;top: 50px;bottom: 0; } </style> <div class="cl">class test</div> View Code ID选择器 1  2 <style type="text/css"> 3 #id1{ 4 background-color: red; 5 height: 30px; 6 font-size: 18px; 7 text-align: center; 8 line-height: 30px; 9 } 10 </style> 11 <div id="id1">好好学习，天天向上</div> View Code 标签选择器  <style type="text/css"> a { color: red; } </style> <ul>

CSS Reset的相关概念及实例

阅读更多关于 CSS Reset的相关概念及实例

原文　　简书原文：https://www.jianshu.com/p/fdb79010895c 大纲　　1、什么是css reset? 　　2、CSS reset的实例 1、什么是css reset? 　　个人理解：就是让不同浏览器的初始化的css样式统一　　1.1、在当今网页设计/开发实践中，使用CSS来为语义化的(X)HTML标记添加样式风格是重要的关键。在设计师们的梦想中都存在着这样的一个完美世界:所有的浏览器都能够理解和适用多有CSS规则，并且呈现相同的视觉效果(没有兼容性问题)。但是，我们并没有生活在这个完美的世界，现实中发生的失窃却总是恰恰相反，很多CSS样式在不同的浏览器中有着不同的解释和呈现。　　1.2、当今流行的浏览器(如:Firefox、Opera、Internet Explorer、Chrome、Safari等等)中，有一些都是以自己的方式去理解CSS规范，这就会导致有的浏览器对CSS的解释与设计师的CSS定义初衷相冲突，使得网页的样子在某些浏览器下能正确按照设计师的想法显示，但有些浏览器却并没有按照设计师想要的样子显示出来，这就导致浏览器的兼容性问题。更糟的是，有的浏览器完全无视CSS的一些声明和属性。　　1.3、正因为上述冲突和问题依然存在于这个”不完美的世界”，所以一些设计师想到了一种避免浏览器兼容性问题的方法，那就是CSS Reset

各种轮播特效代码，无缝轮播与自动轮播

阅读更多关于各种轮播特效代码，无缝轮播与自动轮播

有时候做网页的时候会遇到特效，需要js来写，个人对js并不是很擅长，所以遇到需要用js写的特效都比较惆怅，把几组不同类型的代码保存下来，以后遇到就可以粘贴复制了，废话不多说了，下面步入正题先看一下运行的效果自动往上走的来看一下代码部分吧 html文件中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>文字无缝滚动效果代码</title> <link rel="stylesheet" type="text/css" href="css/style.css" /> <script src="http://www.jq22.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="js/scroll.js"></script>

web前端入门到实战：前端高手在CSS 开发效率的必备片段

阅读更多关于 web前端入门到实战：前端高手在CSS 开发效率的必备片段

这篇文章会记录我们平时常用到的 CSS 片段，使用这些 CSS 可以帮助我们解决许多实际项目问题中遇到的，墙裂建议点赞收藏再看，方便日后查找清除浮动浮动给我们的代码带来的麻烦，想必不需要多说，我们会用很多方式来避免这种麻烦，其中我觉得最方便也是兼容性最好的一种是，在同级目录下再创建一个<div></div>；不过这样会增加很多无用的代码。此时我们用:after这个伪元素来解决浮动的问题，如果当前层级有浮动元素，那么在其父级添加上 clearfix 类即可。 // 清除浮动 .clearfix:after { content: "\00A0"; display: block; visibility: hidden; width: 0; height: 0; clear: both; font-size: 0; line-height: 0; overflow: hidden; } .clearfix { zoom: 1; } 垂直水平居中在 css 的世界里水平居中比垂直居中来的简单一些，经过了多年的演化，依然没有好的方式来让元素垂直居中(各种方式各有优缺点，但都不能达到兼容性好，破坏力小的目标)，以下是几种常见的实现方式绝对定位方式且已知宽高专门建立的学习Q-q-u-n： 784783012 ，分享学习的方法和需要注意的小细节，不停更新最新的教程和学习技巧

蚂蚁庄园

阅读更多关于蚂蚁庄园

<!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.0, maximum-scale=3, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>chick</title> <style> html{min-width:320px;overflow-x:hidden} body,html{height:100%;line-height:1;-webkit-user-select:none;//禁止用户复制页面文本 -webkit-touch-callout:none;-webkit-overflow-scrolling:touch;//ios滚动效果 -webkit-font-smoothing:antialiased;//mac下字体 -webkit-tap-highlight-color:rgba(242,137,76,.05);://a标签点击高亮效果} article,aside,blockquote

MS SQL 监控磁盘空间告警

阅读更多关于 MS SQL 监控磁盘空间告警

原文 http://www.cnblogs.com/kerrycode/archive/2013/05/07/3065960.html 这几天突然有个想法：希望能够自动监控、收集数据库服务器的磁盘容量信息，当达到一个阀值后，自动发送告警邮件给DBA，将数据库磁盘详细信息告知DBA，提醒DBA做好存储规划计划，初步的想法是通过作业调用存储过程来实现（每天调用一次），这样避免了我每天每台数据库服务器都上去检查一下，尤其是手头的数据库服务器N多的情况，这样可以避免我每天浪费无谓的时间。如果大家有更好的建议和方法，欢迎指点一二，我整理、修改了三个存储过程如下：存储过程1：SP_DiskCapacityAlert1.prc 说明：需要通过调用OLE 自动存储过程获取磁盘信息，而这些组件，基于服务器的安全配置，通常是禁用的，我们在存储过程通过sp_configure开启这个服务，调用服务完毕后，又通过sp_configure禁用该服务。另外，数据库服务器都位于内网，因此安全问题应该不大。 USE master; GO SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO IF EXISTS (SELECT 1 FROM dbo.sysobjects WHERE id = OBJECT_ID(N'sp_diskcapacity_alert1'

图片连续滚动

阅读更多关于图片连续滚动

<body> <div id="demo"> <div id="indemo"> <div id="demo1"> <a href="#"><img height="90px" src="images/l1.jpeg" border="0" /></a> <a href="#"><img height="90px" src="images/l2.jpeg" border="0" /></a> <a href="#"><img height="90px" src="images/l3.jpeg" border="0" /></a> <a href="#"><img height="90px" src="images/l4.jpeg" border="0" /></a> <a href="#"><img height="90px" src="images/l5.jpeg" border="0" /></a> <a href="#"><img height="90px" src="images/l6.jpeg" border="0" /></a> </div> <div id="demo2"></div> </div> </div> </body> <script type="text/javascript"> var

订阅 border