评论 - lizhenqiu blog

#¹⁴⁰⁷

作者：广西南宁市

文章：@意见反馈/技术支持/伊网/安企网发表时间：2017-05-31, 16:18:40

展开↯

#¹⁴⁰⁸

作者：广西南宁市

一、json_encode()

<?php
$arr = array ('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5);
echo json_encode($arr);
?>

Run code

Cut to clipboard

输出

{"a":1,"b":2,"c":3,"d":4,"e":5}

Run code

Cut to clipboard

再看一个对象转换的例子：

$obj->body           = 'another post';
$obj->id             = 21;
$obj->approved       = true;
$obj->favorite_count = 1;
$obj->status         = NULL;
echo json_encode($obj);

Run code

Cut to clipboard

输出

{
　　　"body":"another post",
　
　　　"id":21,
　
　　　"approved":true,
　
　　　"favorite_count":1,
　
　　　"status":null
　}

Run code

Cut to clipboard

由于json只接受utf-8编码的字符，所以json_encode()的参数必须是utf-8编码，否则会得到空字符或者null。当中文使用GB2312编码，或者外文使用ISO-8859-1编码的时候，这一点要特别注意。

二、索引数组和关联数组

PHP支持两种数组，一种是只保存"值"（value）的索引数组（indexed array），另一种是保存"名值对"（name/value）的关联数组（associative array）。

由于javascript不支持关联数组，所以json_encode()只将索引数组（indexed array）转为数组格式，而将关联数组（associative array）转为对象格式。

比如，现在有一个索引数组

$arr = Array('one', 'two', 'three');
 
echo json_encode($arr);

Run code

Cut to clipboard

输出

["one","two","three"]

Run code

Cut to clipboard

如果将它改为关联数组：

$arr = Array('1'=>'one', '2'=>'two', '3'=>'three');
　
echo json_encode($arr);

Run code

Cut to clipboard

输出变为

{"1":"one","2":"two","3":"three"}

Run code

Cut to clipboard

注意，数据格式从"[]"（数组）变成了"{}"（对象）。

如果你需要将"索引数组"强制转化成"对象"，可以这样写

json_encode( (object)$arr );

Run code

Cut to clipboard

或者

json_encode ( $arr, JSON_FORCE_OBJECT );

Run code

Cut to clipboard

三、类（class）的转换

下面是一个PHP的类：

class Foo {
 
　　const     ERROR_CODE = '404';
 
　　public    $public_ex = 'this is public';
 
　　private   $private_ex = 'this is private!';
 
　　protected $protected_ex = 'this should be protected';
　
　　public function getErrorCode() {
 
　　　　return self::ERROR_CODE;
 
　　}
 
}

Run code

Cut to clipboard

现在，对这个类的实例进行json转换：

$foo = new Foo;
 
$foo_json = json_encode($foo);
 
echo $foo_json;

Run code

Cut to clipboard

输出结果是

{"public_ex":"this is public"}

Run code

Cut to clipboard

可以看到，除了公开变量（public），其他东西（常量、私有变量、方法等等）都遗失了。

四、json_decode()

该函数用于将json文本转换为相应的PHP数据结构。下面是一个例子：

$json = '{"foo": 12345}';
　
$obj = json_decode($json);
 
print $obj->{'foo'}; // 12345

Run code

Cut to clipboard

通常情况下，json_decode()总是返回一个PHP对象，而不是数组。比如：

$json = '{"a":1,"b":2,"c":3,"d":4,"e":5}';
　
var_dump(json_decode($json));

Run code

Cut to clipboard

结果就是生成一个PHP对象：

object(stdClass)#1 (5) {
 
　　["a"] => int(1)
　　["b"] => int(2)
　　["c"] => int(3)
　　["d"] => int(4)
　　["e"] => int(5)
 
}

Run code

Cut to clipboard

如果想要强制生成PHP关联数组，json_decode()需要加一个参数true：

$json = '{"a":1,"b":2,"c":3,"d":4,"e":5}';
　　
　var_dump(json_decode($json,true));

Run code

Cut to clipboard

结果就生成了一个关联数组：

array(5) {
 
 　　["a"] => int(1)
 　　["b"] => int(2)
 　　["c"] => int(3)
 　　["d"] => int(4)
 　　["e"] => int(5)
 
}

Run code

Cut to clipboard

五、json_decode()的常见错误

下面三种json写法都是错的，你能看出错在哪里吗？

$bad_json = "{ 'bar': 'baz' }";
 
$bad_json = '{ bar: "baz" }';
 
$bad_json = '{ "bar": "baz", }';

Run code

Cut to clipboard

对这三个字符串执行json_decode()都将返回null，并且报错。

第一个的错误是，json的分隔符（delimiter）只允许使用双引号，不能使用单引号。第二个的错误是，json名值对的"名"（冒号左边的部分），任何情况下都必须使用双引号。第三个的错误是，最后一个值之后不能添加逗号（trailing comma）。

另外，json只能用来表示对象（object）和数组（array），如果对一个字符串或数值使用json_decode()，将会返回null。

var_dump(json_decode("Hello World")); //null

Run code

Cut to clipboard

文章：php curl打开网页发表时间：2017-05-31, 16:07:00

展开↯

#¹⁴⁰⁹

作者：广西南宁市

php返回json数据简单实例
include/conn.php为数据库链接文件，不会的网上搜索

<?php 
include './include/conn.php';  //数据库链接文件
$sql_notice = mysql_query('SELECT * FROM gg_notice where enable = "1" limit 0,10');
$notice = mysql_fetch_array($sql_notice, MYSQL_ASSOC);
print_r ($notice);
?>
<!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>
<title>第一php网提供的教程--将数据库读取的数据生成json格式</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"/></script> -->
<script language=javascript>
</script>
</head>
<body>
<pre>
<h1>请注意两种方法生成的对象数组在结构上的区别</h1>
<?php
echo '<h1>法一</h1>';
//假设以下数组是根据我们从数据库读取的数据生成的
$jarr=array('total'=>239,'row'=>array(
           array('code'=>'001','name'=>'中国','addr'=>'Address 11','col4'=>'col4 data'),
           array('code'=>'002','name'=>'Name 2','addr'=>'Address 12','col4'=>'col4 data'),
                                     )
           );
//法一：
$jobj=new stdclass();//实例化stdclass，这是php内置的空类，可以用来传递数据，由于json_decode后的数据是以对象数组的形式存放的，
//所以我们生成的时候也要把数据存储在对象中
foreach($jarr as $key=>$value){
$jobj->$key=$value;
}
print_r($jobj);//打印传递属性后的对象
echo '使用$jobj->row[0][\'code\']输出数组元素:'.$jobj->row[0]['code'].'<br>';
echo '编码后的json字符串：'.json_encode($jobj).'<br>';//打印编码后的json字符串


echo '<hr>';
//法二：
echo '<h1>法二</h1>';
echo '编码后的json字符串：';
echo $str=json_encode($jarr);//将数组进行json编码
echo '<br>';
$arr=json_decode($str);//再进行json解码
print_r($arr);//打印解码后的数组，数据存储在对象数组中
echo '使用$arr->row[0]->code输出数组元素:'.$arr->row[0]->code;

?> 

</body>
</html>

Run code

Cut to clipboard

文章：php curl打开网页发表时间：2017-05-31, 16:02:52

展开↯

#¹⁴¹⁰

作者：广西南宁市

777

#,广西南宁市,2017-05-27,18:35:30, 41414PHP CURL HTTPS POST

function vpost($url,$data){ // 模拟提交数据函数
    $curl = curl_init(); // 启动一个CURL会话
    curl_setopt($curl, CURLOPT_URL, $url); // 要访问的地址
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, 0); // 对认证证书来源的检查
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, 1); // 从证书中检查SSL加密算法是否存在
    curl_setopt($curl, CURLOPT_USERAGENT, $_SERVER['HTTP_USER_AGENT']); // 模拟用户使用的浏览器
    curl_setopt($curl, CURLOPT_FOLLOWLOCATION, 1); // 使用自动跳转
    curl_setopt($curl, CURLOPT_AUTOREFERER, 1); // 自动设置Referer
    curl_setopt($curl, CURLOPT_POST, 1); // 发送一个常规的Post请求
    curl_setopt($curl, CURLOPT_POSTFIELDS, $data); // Post提交的数据包
    curl_setopt($curl, CURLOPT_TIMEOUT, 30); // 设置超时限制防止死循环
    curl_setopt($curl, CURLOPT_HEADER, 0); // 显示返回的Header区域内容
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1); // 获取的信息以文件流的形式返回
    $tmpInfo = curl_exec($curl); // 执行操作
    if (curl_errno($curl)) {
       echo 'Errno'.curl_error($curl);//捕抓异常
    }
    curl_close($curl); // 关闭CURL会话
    return $tmpInfo; // 返回数据
}


$url = "https://xxx.xxx.xxx/xxx";
$data ="x=xxxxxx";
$result = vpost($url,$data);

Run code

Cut to clipboard

#,广西南宁市,2017-05-31,15:51:15,

var_dump(json_decode($json));
$result=json_decode($result,true);

Run code

Cut to clipboard

从5.2版本开始，PHP原生提供json_encode()和json_decode()函数，前者用于编码，后者用于解码。

文章：php curl打开网页发表时间：2017-05-27, 17:45:59

展开↯

#¹⁴¹¹

作者：广西南宁市

CSS3 LOADING页面加载图标动画特效

<style>body {
	background:#000 !important;
	color:#FFF;
}

.loader {
   width:50px;
   height:50px;
   display:inline-block;
   padding:0px;
   opacity:0.5;
   border:3px solid #09acfd;
   -webkit-animation: loader 1s ease-in-out infinite alternate;
   animation: loader 1s ease-in-out infinite alternate;
}

.loader:before {
  content: " ";
  position: absolute;
  z-index: -1;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border: 3px solid #09acfd;
}

.loader:after {
  content: " ";
  position: absolute;
  z-index: -1;
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border: 3px solid #09acfd;
}

@keyframes loader {
   from {transform: rotate(0deg) scale(1,1);border-radius:0px;}
   to {transform: rotate(360deg) scale(0, 0);border-radius:50px;}
}
@-webkit-keyframes loader {
   from {-webkit-transform: rotate(0deg) scale(1, 1);border-radius:0px;}
   to {-webkit-transform: rotate(360deg) scale(0,0 );border-radius:50px;}
}

.loader1 {
   display:inline-block;
   font-size:0px;
   padding:0px;
}
.loader1 span {
   vertical-align:middle;
   border-radius:100%;
   
   display:inline-block;
   width:10px;
   height:10px;
   margin:3px 2px;
   -webkit-animation:loader1 0.8s linear infinite alternate;
   animation:loader1 0.8s linear infinite alternate;
}
.loader1 span:nth-child(1) {
   -webkit-animation-delay:-1s;
   animation-delay:-1s;
  background:rgba(245, 103, 115,0.6);
}
.loader1 span:nth-child(2) {
   -webkit-animation-delay:-0.8s;
   animation-delay:-0.8s;
  background:rgba(245, 103, 115,0.8);
}
.loader1 span:nth-child(3) {
   -webkit-animation-delay:-0.26666s;
   animation-delay:-0.26666s;
  background:rgba(245, 103, 115,1);
}
.loader1 span:nth-child(4) {
   -webkit-animation-delay:-0.8s;
   animation-delay:-0.8s;
  background:rgba(245, 103, 115,0.8);
  
}
.loader1 span:nth-child(5) {
   -webkit-animation-delay:-1s;
   animation-delay:-1s;
  background:rgba(245, 103, 115,0.4);
}

@keyframes loader1 {
   from {transform: scale(0, 0);}
   to {transform: scale(1, 1);}
}
@-webkit-keyframes loader1 {
   from {-webkit-transform: scale(0, 0);}
   to {-webkit-transform: scale(1, 1);}
}

.loader2 {
   width:25px;
   height:25px;
   display:inline-block;
   padding:0px;
   border-radius:100%;
   border:5px solid;
   border-top-color:rgba(254, 168, 23, 0.65);
   border-bottom-color:rgba(57, 154, 219, 0.65);
   border-left-color:rgba(188, 84, 93, 0.95);
   border-right-color:rgba(137, 188, 79, 0.95);
   -webkit-animation: loader2 2s ease-in-out infinite alternate;
   animation: loader2 2s ease-in-out infinite alternate;
}
@keyframes loader2 {
   from {transform: rotate(0deg);}
   to {transform: rotate(720deg);}
}
@-webkit-keyframes loader2 {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(720deg);}
}

.loader3 {
   width:50px;
   height:50px;
   display:inline-block;
   padding:0px;
   text-align:left;
}
.loader3 span {
   position:absolute;
   display:inline-block;
   width:50px;
   height:50px;
   border-radius:100%;
   background:rgba(135, 211, 124,1);
   -webkit-animation:loader3 1.5s linear infinite;
   animation:loader3 1.5s linear infinite;
}
.loader3 span:last-child {
   animation-delay:-0.9s;
   -webkit-animation-delay:-0.9s;
}
@keyframes loader3 {
   0% {transform: scale(0, 0);opacity:0.8;}
   100% {transform: scale(1, 1);opacity:0;}
}
@-webkit-keyframes loader3 {
   0% {-webkit-transform: scale(0, 0);opacity:0.8;}
   100% {-webkit-transform: scale(1, 1);opacity:0;}
}

.loader4 {
   width:45px;
   height:45px;
   display:inline-block;
   padding:0px;
   border-radius:100%;
   border:5px solid;
   border-top-color:rgba(246, 36, 89, 1);
   border-bottom-color:rgba(0,0,0, 0.1);
   border-left-color:rgba(246, 36, 89, 1);
   border-right-color:rgba(0,0,0, 0.1);
   -webkit-animation: loader4 1s ease-in-out infinite;
   animation: loader4 1s ease-in-out infinite;
}
@keyframes loader4 {
   from {transform: rotate(0deg);}
   to {transform: rotate(360deg);}
}
@-webkit-keyframes loader4 {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(360deg);}
}

.loader5 {
  display:inline-block;
  width: 0;
	height:0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #4183D7;
  border-top: 10px solid #F5AB35;
   -webkit-animation: loader5 1.2s ease-in-out infinite alternate;
   animation: loader5 1.2s ease-in-out infinite alternate;
}

@keyframes loader5 {
   from {transform: rotate(0deg);}
   to {transform: rotate(720deg);}
}
@-webkit-keyframes loader5 {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(720deg);}
}

.loader6 {
  display:inline-block;
  width: 20px;
	height:20px;
	border-left: 2px solid transparent;
	border-right: 2px solid transparent;
	border-bottom: 2px solid #D24D57;
  border-top: 2px solid #D24D57;
  -webkit-animation: loader6 1.8s ease-in-out infinite alternate;
  animation: loader6 1.8s ease-in-out infinite alternate;
}

.loader6:before {
  content: " ";
  position: absolute;
  z-index: -1;
  top: 5px;
  left: 0px;
  right: 0px;
  bottom: 5px;
  border-left: 2px solid #D24D57;
  border-right: 2px solid #D24D57;
}

@keyframes loader6 {
   from {transform: rotate(0deg);}
   to {transform: rotate(720deg);}
}
@-webkit-keyframes loader6 {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(720deg);}
}


.loader7 {
  display:inline-block;
   width: 30px;
   height: 4px;
   background:#BE90D4;
    -webkit-animation: loader7 1.5s linear infinite;
  animation: loader7 1.5s linear infinite;
}


@keyframes loader7 {
   from {transform: rotate(0deg);}
  to {transform: rotate(720deg);}
}
@-webkit-keyframes loader7 {
   from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(720deg);}
}
.loader8 {
  display:inline-block;
    background: rgba(247, 202, 24,0.6);
    width: 30px;
    height: 30px;
    position: relative;
    text-align: center;

    -webkit-transform: rotate(20deg);
       -moz-transform: rotate(20deg);
        -ms-transform: rotate(20deg);
         -o-transform: rotate(20eg);
      -webkit-animation: loader7 3s linear infinite;
  animation: loader7 3s linear infinite;
}
.loader8:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
    width: 30px;
    background: rgba(247, 202, 24,0.5);
    -webkit-transform: rotate(135deg);
       -moz-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
         -o-transform: rotate(135deg);
}

.loader9 {
  display:inline-block;
    position: relative;
    width: 50px;
    height: 50px;
  -webkit-animation:loader9 1.5s linear infinite;
   animation:loader9 1.5s linear infinite;
}
.loader9:before,
.loader9:after {
    position: absolute;
    content: "";
    left: 30px;
    top: 0;
    width: 30px;
    height: 50px;
    background: red;
    -moz-border-radius: 30px 30px 0 0;
    border-radius: 30px 30px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
.loader9:after {
    left: 0;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}
	
@keyframes loader9 {
   0% {transform: scale(0, 0);opacity:0;}
   100% {transform: scale(1, 1);opacity:1;}
}
@-webkit-keyframes loader9 {
   0% {-webkit-transform: scale(0, 0);opacity:0;}
   100% {-webkit-transform: scale(1, 1);opacity:1;}
}</style><br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 0</p>
			<div class="loader"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 1</p>
			<div class="loader1">
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
			</div>
		</div>
	</div>

</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 2</p>
			<div class="loader2"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 3</p>
			<div class="loader3">
				<span></span>
				<span></span>
			</div>
		</div>
	</div>
</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 4</p>
			<div class="loader4"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 5</p>
			<div class="loader5"></div>
		</div>
	</div>
</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 6</p>
			<div class="loader6"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 7</p>
			<div class="loader7"></div>
		</div>
	</div>
</div>  

<br/><br/><br/>

<div class="container">
	<div class="row">
		<div class="col-md-6 text-center">
			<p>loader 8</p>
			<div class="loader8"></div>
		</div>
		<div class="col-md-6 text-center">
			<p>loader 9</p>
			<div class="loader9"></div>
		</div>
	</div>
</div>

Run code

Cut to clipboard

文章：常用html、demo代码发表时间：2017-05-27, 14:35:27

展开↯

#¹⁴¹²

作者：广西南宁市

悔创阿里杰克马

#,广西南宁市,2017-05-17,15:02:10, “问题不是谁会允准我，而是谁会阻止我。”

——艾茵·兰德

#,广西南宁市,2017-05-17,15:05:48, 但乌布雷和丝绸之路的致命缺陷还不止于此。或者干脆说，他们是成于技术、毁于技术。当初为了加强丝绸之路的安全，乌布雷雇佣了许多黑客，但即便如此，惯于寻踪觅迹的特工们最后还是捕捉到了初期编码的一个错误，并据此搜出了一个咖啡馆的 IP 地址。而乌布雷正是那里的常客。拿到这一线索后，FBI、IRS、DHS 以及 DOJ 等多个组织纷纷开始顺藤摸瓜；所有的证据汇总起来后，都指向了同一个目标： 2013 年 10 月某天下午的某图书馆里，那个抱着手提闷头打字、浓眉乌眼的年轻人——乌布雷。

被摁倒时，这个亿万富翁口袋里只装了两美元。

#,广西南宁市,2017-05-17,15:06:03, 还是那句话：乌布雷从没想过丝绸之路会滋生出如此罪过。我采访过几十个熟悉他的人，他们都告诉我说乌布雷为人善良、富于同情。他会协助老太太过马路，会用贴心的礼物给人惊喜，会在邮件中以“Fudge”代替“Fuck”——甚至在丝绸之路开张后也是如此。但后来，他还是变了。是非之间的那条分界线一天模糊一点，一天模糊一点，直至最后，两者完全混淆，而乌布雷也终于变成了 DPR。

#,广西南宁市,2017-05-17,15:07:27,

从乌布雷到 DPR，谁也不知道变化是从哪天开始的

只有一件事是再清晰不过的，那就是：眼看着自己的创造被用于罪恶，乌布雷却无能为力，直至最后他自己也成了手持屠刀的人。

为明天搭建技术的当代人很少去想他人会如何用自己的心血去为非作歹。但我们是真的已经到了一个转折点。特朗普时代已经到来，硅谷的重任再也不是“快速前进，打破陈规”了，而是该想想如何防范可怕的科技滥用。

可悲的是，乌布雷本人没有早点学到这一课。而因为已被判处终身监禁，所以，他只能永远缺课了。

#,广西南宁市,2017-05-17,15:09:38, 现在一些大佬都在研究人工智能，未来一旦控制不了或者有漏洞被恐怖分子利用或者自我进化那将是人类的末日，细思级恐。当它设定为生存时，不择手段防卫，杀掉要摧毁它的人，易如反掌。仇恨机制也是可以学习到的。

#,广西南宁市,2017-05-17,15:11:12, 没法儿说。武器既可以用来防身，也能用来杀人。到底是武器的问题，还是人的问题？！

#,广西南宁市,2017-05-19,11:27:13, 跟一个中风说话结巴的患者说，你需要释放气场、学会用眼神交流，这样才会更自信，自信了就不会口吃了... 请先把中风根治吧!

#,广西,2017-05-19,12:24:52, 本该玩的年龄，却怎么心事重重，本该放纵的青春，却怎么只能听天由命。

#,北京市,2017-05-21,17:46:31, 最近几年以来，我拥有着一个非常健康的生活方式，不抽烟，不喝酒，不泡吧，不搭讪陌生女孩，并且每天都是早上六点起床，十点就寝，每天坚持锻炼身体，可是，就在前段时间，我的生活完全被打乱了，因为，，，，，，，，我出狱了

#,广西南宁市,2017-05-26,11:12:14,@9, 现在的地方网站，更像是一个活动公司，而不是互联网公司。

#,广西南宁市,2017-05-26,11:31:30,@10, 地方小站正如路边摊，终成不了气候，因为一直纠结于吃不饱的问题。

#,广西南宁市,2017-05-26,11:39:27, 如果努力本身不能使你快乐，漫漫前路，便只剩压力和痛苦，每天调节自己的负能量都来不及，谈何出类拔萃?任何行业，努力至多帮你存活，不会帮你出类拔萃，只有发自内心的爱会。

#,广西南宁市,2017-05-26,11:47:54, 当你是个乞丐的时代，千万不要吹牛，假装自己是皇上，给爷来个御厨，因为它会给你在心里构建一个虚幻而美好的未来。

#,广西南宁市,2017-05-26,11:48:15, 靠打鸡血、跳励志操、给员工洗脑、给客户送钱，拉着代理商加盟商吃吃喝喝，这些老办法是没啥希望了。

#,广西南宁市,2017-05-26,11:56:41, 如果说爱国主义是恶棍最后的避难所，那么坚守实业就是烂企业最后的护身符。

#,广西南宁市,2017-05-26,14:16:40,@15, 当员工有了主人翁意识的时候，每一项改进他都愿意贡献智慧。

#,广西南宁市,2017-05-26,14:21:19,@16, 转型的关键在于价值创新，为整个产业链赋予新的价值，没有了价值创新，“转型”只能沦为“转行”。

#,广西南宁市,2017-05-26,14:22:10, 而这些模式说到底就一句话“找个新渠道卖货”。

#,广西南宁市,2017-05-26,14:22:22,@18, 线下代理商不行了改电商，电商不行了换微商，再不行就做直播，做社群营销，做IP营销，C2C、C2B、C2M、O2O、OAO……动不动设个小目标，砸几个亿建个平台，最后发现，无论建了多少个平台，用了多少种模式，自己的品牌、自己的产品还是不值钱。

#,广西南宁市,2017-05-26,14:27:23, 客观地讲，牛人大神们可能是有不少大忽悠的，但为什么偏偏都被你遇见了呢？当你迷信这些牛人大神能解决你所有问题的时候，这种结局就已经注定了。

#,广西南宁市,2017-05-26,14:34:06, 你今天做企业面对的困难，从来不是因为缺少牛人，不是因为你的人不行了，而是因为人的协作方式不行了，也就是你的内部组织架构和沟通机制出了问题。当你的体制不行的时候，用一群牛人，还不如用一群怂人，至少他们不打架。

#,广西南宁市,2017-05-26,14:37:42, 在我们很多传统制造企业里，老板、领导都是全能选手，无所不能。公司内大大小小的会议都可以成为老板个人成功经验的交流会，成为他传授成功致富秘笈的函授班，你还不敢提不同意见，要么说你不切实际，要么说你不服管，再给你穿点小鞋，保证你混不下去。这就是我们制造业企业家们对自己过往成功经验深度迷信的结果。

不可否认，传统企业家很多都是筚路蓝缕的发展，依靠个人的聪明才智、人脉关系逐渐壮大起来的。但悲剧就在于，这种成功对于企业家自身的束缚，已经成为了企业转型升级最大的障碍。他们相信“道”，相信万变不离其宗，以为自己三十几年前的成功经验可以指导如今新时代下的一切工作，所以，就导致他们既看不到变化，也不愿意变化。

更可怕的是，这种成功的老板，会在企业内部培养出一个依赖于这种成功的生态系统，也就是跟着老板一起筚路蓝缕开创成功的元老团队，他们是这种成功的既得利益者。所以任何人都不能质疑这种成功经验，改变就意味着威胁他们的地位，这股强大的保守力量，足以扼杀任何外来的新鲜血液。

这个时候，就算老板们痛下决心想要变革，也只能有两种选择，要么内部进行大清洗，清除元老，落下个无情无义的骂名。要么内部进行妥协，在新晋者和元老中间和稀泥，这能解决眼前的问题，但长远看必将引发更大的冲突。所以，对于这些带着成功光环的制造业老板们而言，这就是一种骑虎难下、进退失据的局势。

所以，对于传统制造业企业家，尤其是曾经很成功的企业家，转型升级的第一步，就是要学会破除自己的权威，摘掉自己的光环，这个过程很痛苦很艰难，但是必须去做。因为只有突破过往成功的束缚，我们才能迎来更大的成功。

文章：@意见反馈/技术支持/伊网/安企网发表时间：2017-05-16, 14:19:59

展开↯

#¹⁴¹³

作者：广西南宁市

男人都是寄生在蛋蛋上的附属设施

#,广西南宁市,2017-05-26,09:21:19, 在移动时代后半场的今天，巨头们都越来越喜欢给自己的产品加戏，活生生把一个小而美的 App，做成了远古时代的门户网站。

#,广西南宁市,2017-05-26,09:22:33,@1, 在解构完成后，所有的玩家都会想要以自身为中心，继续去做重新组合的事情，从而获取更多的用户时间。这其实也有点像合久必分、分久必合的亘古法则。

#,广西南宁市,2017-05-26,09:29:28, 一个光以年龄作为细分标准的社区，不一定有可持续性。因为用户的年龄会流动，但兴趣不会。垂直技能、爱好社区（Github、Behance、IMDB）永远是很稳定的。

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-10-12, 15:15:14

展开↯

#¹⁴¹⁴

作者：广西南宁市

同意用户协议


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="format-detection" content="telephone=no" />
<title>Blued 最终用户许可协议</title>
<style type="text/css">
body{
    margin:20px 10px;
    color: #666;
    background-color:#FFF;
}
h2 {
    color: #333;
    text-align: center;
}
</style>
</head>
<body>
<h2>总则</h2>
<p>1、Blued是由北京蓝城兄弟信息技术有限公司开发并运营的基于地理位置的同志人群移动社交软件。</p>
<p>2、Blued用户是指完成全部注册流程，愿意接受本用户条款并在Blued相关使用规范的规定下使用软件服务的注册用户。</p>
<p>3、本服务条款可能随时更新，更新后的服务条款一旦公布即代替原来的服务条款，恕不再另行通知，用户可在本网站查阅最新版服务条款。</p>
<p></p>
<p></p>
<h2>使用规则</h2>
<p>1、本条所述内容是指用户使用本服务过程中所制作、上载、复制、发布、传播的任何内容，包括但不限于账号头像、名称、用户说明等注册信息及认证资料，或文字、语音、图片、视频、图文等发送、回复或自动回复消息和相关链接页面，以及其他使用账号或本服务所产生的内容。</p>
<p>2、用户不得利用Blued账号或本服务制作、上载、复制、发布、传播如下中华人民共和国法律、法规和政策禁止的内容：</p>
<p>(1)  反对宪法所确定的基本原则的；</p>
<p>(2)  危害国家安全，泄露国家秘密，颠覆国家政权，破坏国家统一的；</p>
<p>(3)  损害国家荣誉和利益的；</p>
<p>(4)  煽动民族仇恨、民族歧视，破坏民族团结的；</p>
<p>(5)  破坏国家宗教政策，宣扬邪教和封建迷信的；</p>
<p>(6)  散布谣言，扰乱社会秩序，破坏社会稳定的；</p>
<p>(7)  散布淫秽、色情、赌博、暴力、凶杀、恐怖或者教唆犯罪的；</p>
<p>(8)  侮辱或者诽谤他人，侵害他人合法权益的；</p>
<p>(9)  煽动非法集会、结社、游行、示威、聚众扰乱社会秩序；</p>
<p>(10)  以非法民间组织名义活动的；</p>
<p>(11)  不符合《即时通信工具公众信息服务发展管理暂行规定》及遵守法律法规、社会主义制度、国家利益、公民合法利益、公共秩序、社会道德风尚和信息真实性等“七条底线”要求的；</p>
<p>(12)  含有法律、行政法规禁止的其他内容的。</p>
<p></p>
<p>3、用户不得利用Blued账号或本服务制作、上载、复制、发布、传播如下干扰Blued正常运营，以及侵犯其他用户或第三方合法权益的内容：</p>
<p>(1)  含有任何性或性暗示的（例如包括但不限于涉嫌约炮等字眼、个人私处描述）；</p>
<p>(2)  含有辱骂、恐吓、威胁内容的；</p>
<p>(3)  含有骚扰、垃圾广告、恶意信息、诱骗信息的；</p>
<p>(4)  涉及他人隐私、个人信息或资料的（例如包括但不限于详细地址描述，详细工作职位描述）；</p>
<p>(5)  发布、传送、传播、储存侵害他人名誉权、肖像权、知识产权、商业秘密等合法权利的；</p>
<p>(6)  提交、发布虚假信息，或冒充、利用他人名义的；</p>
<p>(7)  含有其他违反法律法规、政策及公序良俗、社会公德或干扰本服务正常运营和侵犯其他用户或第三方合法权益内容的信息。</p>
<p></p>
<p>4、为更好地服务同志人群，Blued制订了附加条款，用于规范用户在Blued中的行为。</p>
<p>(1)  个人签名、头像、动态、群组头像、群组简介中不得含有电话号码或疑似电话号码；</p>
<p>(2)  头像、相册、动态配图、群组头像不允许上传包含网站(QQ空间、微博除外)、电话号码水印、二维码的图片；</p>
<p>(3)  头像、相册、动态配图、群组头像中不允许上传任何证件照或疑似证件照的图片；</p>
<p>(4)  个人签名、头像、动态、相册、动态配图、群组头像、群组简介中不能有营销类、创业类、传销类（包括微店微商）等相关文字或图片；</p>
<p>(5)  头像、相册、群组头像中不允许上传女性照片（不包括女星、漫画等）；</p>
<p>(6)  头像、相册、群组头像中不允许上传涉嫌广告或其他软件的LOGO、极其模糊的卡通、纯色色块等；</p>
<p></p>
<p>5、如用户违反本条款以及相关法律法规的规定，Blued有权进行独立判断并限制、冻结或终止用户帐号的使用，并且根据实际情况决定是否恢复使用。特别提示：</p>
<p>(1)  反复上传同条违规信息，会导致您的账号被封禁；</p>
<p>(2)  违反以上任何一条用户条款，均有可能导致您的账号被封禁。</p>
<p></p>
<p>6、用户在使用本服务中或通过本服务所传送的任何内容并不反映Blued的观点或政策，Blued对此不承担任何责任。</p>
<p></p>
<p></p>
<h2>风险提示</h2>
<p>1、请用户仔细阅读充分理解本服务条款，自主考虑风险。为了提供有效的服务，本服务会利用终端设备的带宽和处理器等资源，使用过程中可能产生数据流量的费用，用户需自行向运营商了解相关资费信息，并自行承担相关费用。</p>
<p>2、使用本服务，用户须自行承担如下Blued不可掌控的风险内容，包括但不限于：由于受到恶意程序、黑客攻击的破坏等不可抗力可能引起的信息丢失风险；用户或Blued的软件、硬件、系统或通信线路出现故障等原因所引起的账号登陆失败、资料同步不完整、打开速度慢等风险；用户操作不当以及其他无法控制或合理预见的情形。</p>
<p>3、用户应当理解，用户通过本服务发布的内容可能被其他用户或第三方复制、转载、修改或者用做其他用途，对于可能带来的风险和责任，用户要有预期和意识，任何不愿被他人获知的信息包括但不限于证件信息等都不应在Blued发布。</p>
<p>4、用户应当理解，在使用本服务中可能存在有来自他人的包括威胁性、诽谤性、令人反感或非法的内容或行为，或对他人权利的侵犯的匿名或冒名的信息的风险，用户须承担以上风险，Blued对本服务不作任何类型的担保，不论是明确的或隐含的，包括所有有关信息真实性、所有权和非侵权性的明示或默示担保和条件，对因此导致任何因用户不正当或非法使用服务产生的损害，不承担任何责任。</p>
<p>5、Blued依据本协议约定获得处理违法违规内容或行为的权利，该权利不构成Blued的义务或承诺。如果其他用户侵犯了你的合法权益，你可以向Blued投诉，我们将依照法律和规定进行处理。</p>
<p></p>
<p></p>
<h2>其他</h2>
<p>1、本用户条款签订地为北京市朝阳区。本条款的解释、效力及纠纷的解决，适用于中华人民共和国法律。若用户和Blued之间发生任何纠纷或争议，首先应友好协商解决，协商不成的，用户同意将纠纷或争议提交Blued所在地即北京市有管辖权的人民法院管辖。</p>
<p>2、本协议的任何条款无论因何种原因无效或不具可执行性，其余条款仍有效，对双方具有约束力。</p>
<p>3、本服务条款可能随时更新，更新后的服务条款一旦公布即代替原来的服务条款，不再另行通知，用户可在本网站查阅最新版服务条款。</p>
<p>4、本协议的版权由Blued所有，Blued保留一切解释和修改权利。</p>
</body>
</html>

Run code

Cut to clipboard

文章：常用html、demo代码发表时间：2017-05-26, 09:19:58

展开↯

#¹⁴¹⁵

作者：广西南宁市

#1630,a fake WannaCry
假装自己是个病毒

#,广西南宁市,2017-05-16,14:59:34, 良心病毒，首发区有中国，自带简体中文，不锁区。

#,广西南宁市,2017-05-16,16:43:37,

#,广西南宁市,2017-05-16,16:43:58,

#,广西南宁市,2017-05-16,16:48:06, @, 4445454

#,广西南宁市,2017-05-16,16:53:52, @3,

#,广西南宁市,2017-05-16,16:54:07, @5,

#,广西南宁市,2017-05-16,17:03:49,@6,

#,广西南宁市,2017-05-16,17:10:30,@7,

#,广西南宁市,2017-05-16,17:10:50,

#,广西南宁市,2017-05-16,17:11:48,@9,

#,广西南宁市,2017-05-16,17:12:15,@9,

#,广西南宁市,2017-05-16,17:16:40,@10, 1213131

#,广西南宁市,2017-05-16,17:29:43,@9,

#,广西南宁市,2017-05-16,17:29:59,@12,

#,广西南宁市,2017-05-17,11:58:23, ❏❐❑❒▏▐░▒▓▔▕■□▢▣▤▥▦▧▨▩▪▫▬▭▮▯ˍ∎⊞⊟⊠⊡⋄▱◆◇◈◧◨◩◪◫◰◱◲◳◻◼◽◾⧈⧫⎔◙◘▀▁▂▃▄▅▆▇▉▊▋█▌▍▎▛▜▝▞▟▖▗▘▙▚▰

#,广西南宁市,2017-05-17,15:11:28, 理想很丰满，现实很血腥~ 关于 WannaCry其实我们应该反思的是“物理隔绝的原则”，只要有数据交换，就有被侵入的可能，无论是光盘摆渡，还是单向光闸。然而搬运工本身是不会区分病毒的，更不会在搬运的同时还会主动甄别病毒~~

#,广西南宁市,2017-05-17,17:29:07,

#,北京市,2017-05-17,19:50:38, 杜蕾斯以179亿美元收购美赞臣！最大的避孕套生产商买下了最大的奶粉制造商，赤裸裸诠释什么是风险对冲。——你要么今天用他们的套，要么十个月后用他们的奶，生意做到这个份上，实在是牛，横竖他都赚，套路太深！广告词是这样的:那些没有被我们杀掉的小孩，我们负责养大！

#,广西南宁市,2017-05-18,15:06:43,

#,广西南宁市,2017-05-19,10:20:11,@3,

#,广西南宁市,2017-05-19,14:15:04, 历史除了名字都是假的，小说除了名字都是真的。

#,广西南宁市,2017-05-22,11:34:20,@20,

#,广西南宁市,2017-05-25,11:00:25,
⌘（ command ）
⌥（ option ）
⇧（ shift ）
⇪（ caps lock ）
⌃（ control ）
↩（ return ）
⌅（ enter ）
依旧不太记得住，常用的快捷键按熟了，用新的 APP 翻配置的时候还是会蒙比。。

文章：@意见反馈/技术支持/伊网/安企网发表时间：2017-05-16, 17:11:23

展开↯

#¹⁴¹⁶

作者：广西南宁市

文章：常用html、demo代码发表时间：2017-05-24, 23:06:29

展开↯

#¹⁴¹⁷

作者：广西南宁市

文章：常用html、demo代码发表时间：2017-05-24, 20:48:45

展开↯

#¹⁴¹⁸

作者：广西南宁市

CSS对话气泡的小尖角像iMessage那样的气泡尖角

<style>@import "compass/css3";

body {
	font-family: "Helvetica Neue";
	font-size: 20px;
	font-weight: normal;
}

section {
	max-width: 450px;
	margin: 50px auto;

	div {
		max-width: 255px;
		word-wrap: break-word;
		margin-bottom: 20px;
    line-height: 24px;
	}
}

.clear {clear: both}
.from-me {
	position:relative;
	padding:10px 20px;
	color:white; 
	background:#0B93F6;
	border-radius:25px;
	float: right;
		
	&:before {
		content:"";
		position:absolute;
		z-index:-1;
		bottom:-2px;
		right:-7px;
		height:20px;
		border-right:20px solid #0B93F6;
		border-bottom-left-radius: 16px 14px;
		-webkit-transform:translate(0, -2px);
	}

	&:after {
		content:"";
		position:absolute;
		z-index:1;
		bottom:-2px;
		right:-56px;
		width:26px;
		height:20px;
		background:white;
		border-bottom-left-radius: 10px;
		-webkit-transform:translate(-30px, -2px);
	}
}
.from-them {
	position:relative;
	padding:10px 20px;
	background:#E5E5EA;
	border-radius:25px;
	color: black;
  float: left;
		
	&:before {
		content:"";
		position:absolute;
		z-index:2;
		bottom:-2px;
		left:-7px;
		height:20px;
		border-left:20px solid #E5E5EA;
		border-bottom-right-radius: 16px 14px;
		-webkit-transform:translate(0, -2px);
	}

	&:after {
		content:"";
		position:absolute;
		z-index:3;
		bottom:-2px;
		left:4px;
		width:26px;
		height:20px;
		background:white;
		border-bottom-right-radius: 10px;
		-webkit-transform:translate(-30px, -2px);
	}
}</style>
<section>
    <div class="from-me">
      <p>Hey there! What's up?</p>
    </div>
  <div class="clear"></div>
    <div class="from-them">
      <p>Checking out iOS7 you know..</p>
    </div>
  <div class="clear"></div>
    <div class="from-me">
      <p>Check out this bubble!</p>
    </div>
  <div class="clear"></div>
    <div class="from-them">
      <p>It's pretty cool!</p>
    </div>
  <div class="clear"></div>
    <div class="from-me">
      <p>Yeah it's pure CSS &amp; HTML</p>
    </div>
  <div class="clear"></div>
    <div class="from-them">
      <p>Wow that's impressive. But what's even more impressive is that this bubble is really high.</p>
    </div>
  </section>

Run code

Cut to clipboard

在线小三角css提示tipscssarrowplease

#,广西南宁市,2017-05-24,18:01:33, iOS7 Chat bubbles

文章：常用html、demo代码发表时间：2017-05-24, 17:55:41

展开↯

#¹⁴¹⁹

作者：广西南宁市

js本地图片转base64
js小工具---本地图片转换为base64编码数据

<input type="file" onchange ="startt(this);">  
<script>
    /*转换函数*/  
    function startt(img) {  
        var imgFile = new FileReader();  
        imgFile.readAsDataURL(img.files[0]);  
        imgFile.onload = function () {  
            var imgData = this.result; //base64数据    
			alert(imgData);
            /*imgShow.setAttribute('src', imgData);  
            conte.value = imgData;  
            len.innerHTML += imgData.length;  */
        }  
    }
</script>

Run code

Cut to clipboard

文章：常用html、demo代码发表时间：2017-05-24, 17:01:33

展开↯

#¹⁴²⁰

作者：广西南宁市

css3让背景宽为100%时，高度跟这个背景图等比例拉伸

<div style="width:100px;">
	<div style="
	width:100%;
	height::0;
	padding-bottom:50%;/*这里可以设定比例*/
	background:url(https://lizhenqiu.com/favicon.ico);
	"></div>
</div>

Run code

Cut to clipboard

你需要做一个高宽比固定的容器,
这里有一个比较偏的小技巧,就是padding-bottom是按照父元素的宽度比计算的,而不是按高度算,所以这里可以用溢出
给父元素宽度值，子元素宽度100%
参考纯 CSS 实现高度与宽度成比例的效果

#,广西南宁市,2017-05-24,16:14:27, 高度自动跟这个背景图片等比例拉伸
div不设置高度自动自适应图片高度获取高度背景css容器后高度

文章：常用html、demo代码发表时间：2017-05-24, 16:12:16

展开↯

#¹⁴²¹

作者：广西南宁市

现在挺好，3大平台的编程语言都很现代、优雅了：
Windows：C#
Android：Kotlin
iOS：Swift

文章：常用html、demo代码发表时间：2017-05-24, 11:51:45

展开↯

#¹⁴²²

作者：广西南宁市

什么是奋斗？奋斗就是每一天都很难，可一年比一年越来越容易。不奋斗就是每一天都很容易，可一年比一年却越来越难。所以说：怕吃苦的人吃苦一辈子，不怕吃苦的人吃苦一阵子。拼一个春夏秋冬，赢一个无悔人生！正像乔丹说的：可以接受失败的我，但决不能接受从来没有奋斗过的我。

文章：蓝鲸游戏前一段时间在朋友圈刷屏了。发表时间：2017-05-24, 11:08:44

展开↯

#¹⁴²³

作者：北京市

//绑定回到顶部按钮的点击事件
$('#up').click(function(){
//动画效果，平滑滚动回到顶部
$('body').animate({ scrollTop: 0 });
//不需要动画则直接
//$('body').scrollTop(0)
})

#,广西南宁市,2017-05-23,17:28:56, top,left
margin-left,margin-right等同时使用可以自动拉宽高度？
css样式中，fixed的和absolute有一样的特性，我们并没有给这个div设置高度，而是通过：top:0;bottom:0;来设置div的高度。这个好理解，就是说这个div上顶着天，下踩着地，那就是百分百的高度了。
通过top,bottom联合定位使用，就可以确定absflex div的自适应高度
top优先了，left和right也一样,left优先?还是谁在前谁优先？

#,广西南宁市,2017-05-23,17:34:02, 布局-ie6下的top和bottom不能同时起作用。
一、使用position+top/bottom/left/right布局时可以忽略block元素换行的影响。
二、浮动布局在三列的情况下不能实现左右两列固定大小，中间填充的效果。(postion可以）。
三、使用position布局时，在ie6中，对同一对像不能同时使用top/bottom，但可以同时使用left/right。
四、使用position布局时应该先在父容器中设置好position:absolute，然后在本对像中也设置好position:absolute。
五、三列布局，且左右两边大小固定，中间填充的方法是左边设置top/left,右边设置right/top。而中间设置top/left/right，并且一定要把width设为100%。
六、在ie6中需要在body中设置height:100%才能在垂直布局中使对像申展到预期frame的大小。
七、关于ie hack。ie7只认*，ie6认_和*。

文章：常用html、demo代码发表时间：2016-01-04, 02:36:33

展开↯

#¹⁴²⁴

作者：广西南宁市

广告屏蔽(刷新)失效，请在本地ad.js后面加版本号，?v..
这样就防止某些屏蔽规则不禁加载本地ads.js文件了

文章：网页检测 AdBlock 的 6 种方法发表时间：2017-05-23, 17:20:54

展开↯

#¹⁴²⁵

作者：广西南宁市

CSS
    ::-webkit-scrollbar              { /* 1 */ }
    ::-webkit-scrollbar-button       { /* 2 */ }
    ::-webkit-scrollbar-track        { /* 3 */ }
    ::-webkit-scrollbar-track-piece  { /* 4 */ }
    ::-webkit-scrollbar-thumb        { /* 5 */ }
    ::-webkit-scrollbar-corner       { /* 6 */ }
    ::-webkit-resizer                { /* 7 */ }

Run code

Cut to clipboard

以上CSS代码所管辖的区域对就关系：以上注释中的数字与下图中数字相对应。

上图正如如下所言：

::-webkit-scrollbar 滚动条整体部分，其中的属性有width,height,background,border（就和一个块级元素一样）等。
::-webkit-scrollbar-button 滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。
::-webkit-scrollbar-track 外层轨道。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。
::-webkit-scrollbar-track-piece 内层轨道，滚动条中间部分（除去）。
::-webkit-scrollbar-thumb 滚动条里面可以拖动的那部分
::-webkit-scrollbar-corner 边角
::-webkit-resizer 定义右下角拖动块的样式
注意：对以上各个部分定义width,height时。有如下功能：若是水平滚动条，则width属性不起作用，height属性用来控制滚动条相应部分竖直方向高度；若是竖直滚动条，则height属性不起作用，width属性用来控制相应部分的宽度。

http://www.lyblog.net/detail/314.html
http://runjs.cn/code/mperijd6

Run code

Cut to clipboard

自定义浏览器滚动条的样式，打造属于你的滚动条风格
自定义滚动条-谷歌浏览器
webkit内核的浏览器滚动条定制

html::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

html::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

html::-webkit-scrollbar-thumb
{
	background-color: #000000;
}

Run code

Cut to clipboard

#,广西南宁市,2017-05-23,17:19:05,

::-webkit-scrollbar 滚动条整体部分
::-webkit-scrollbar-thumb  滚动条里面的小方块，能向上向下移动（或往左往右移动，取决于是垂直滚动条还是水平滚动条）
::-webkit-scrollbar-track  滚动条的轨道（里面装有Thumb）
::-webkit-scrollbar-button 滚动条的轨道的两端按钮，允许通过点击微调小方块的位置。
::-webkit-scrollbar-track-piece 内层轨道，滚动条中间部分（除去）
::-webkit-scrollbar-corner 边角，即两个滚动条的交汇处
::-webkit-resizer 两个滚动条的交汇处上用于通过拖动调整元素大小的小控件

Run code

Cut to clipboard

文章：2个div 点击第一个变色，点击第2个的时候第2个变色，同时第一个颜色去掉发表时间：2016-07-14, 15:48:25

展开↯

Records:2796 75/148 «‹71 72 73 74 75 76 77 78 79 ›»