现在的位置: 首页学习笔记>正文
CSS常用小技巧
发表于5年前 学习笔记 评论数 2

有些事,项目准备明天开始继续开工,所以决定今天更新个小技巧.

这样也好,以后可能需要很方便就可以找到.

CSS小技巧

  1. CSS可以控制字母之间的间距么,不是行距   
  2. word-spacing: 1em    
  3. letter-spacing10px(字母)   
  4.   
  5. ------------------------   
  6. //div圆角   
  7.     -moz-border-radius: 5px;    
  8.     -khtml-border-radius: 5px;    
  9.     -webkit-border-radius: 5px;    
  10.     border-radius: 5px;   
  11. ---------------------   
  12.   text-overflow : clip | ellipsis   
  13.   参数:   
  14.   clip :  不显示省略标记(…),而是简单的裁切   
  15.   ellipsis :  当对象内文本溢出时显示省略标记(…)   
  16.   说明:   
  17.   设置或检索是否使用一个省略标记(…)标示对象内文本的溢出。   
  18. //////////////////////////////////////////////////   
  19.   
  20. <script language="javaScript">    
  21.     var thistid=243958;    
  22.        
  23.     //收藏按钮   
  24.     var favor_url = 'http://www.mechao.cn/art/201101/243958.htm';  // 如:http://bbs.51cto.com/thread-789649-1.html   
  25.     var favor_title = '使用 jQuery 简化 Ajax 开发(2)';       //     
  26.        
  27.     //绑定复制按钮   
  28.     copy('msnqqcopy', 'http://www.mechao.cn/art/201101/243958.htm', '分享到MSN/QQ的链接复制成功!');   
  29. //  copy('bbscopy', '[url=http://www.mechao.cn/art/201101/243958.htm][u]使用 jQuery 简化 Ajax 开发(2)[/u][/url]', '分享到论坛的UBB代码复制成功!');   
  30.   
  31. </script>   
  32.   
  33. 1.TEXTAREA自适应文字行数的多少   
  34.  <textarea rows=1 name=s1 cols=27 onpropertychange="this.style.posHeight=this.scrollHeight">   
  35.  </textarea>   
  36.   
  37. 2.脚本永不出错   
  38.  <SCRIPT LANGUAGE="javascript">    
  39.  <!-- Hide    
  40.  function killErrors() {    
  41.  return true;    
  42.  }    
  43.  window.onerror = killErrors;    
  44.  // -->    
  45.  </SCRIPT>   
  46. 3.ENTER键可以让光标移到下一个输入框   
  47.  <input onkeydown="if(event.keyCode==13)event.keyCode=9">   
  48. 4.预定秒数内自动转到指定网址   
  49.  <meta http-equiv="refresh" content="10; url=http://www.mechao.cn">    
  50. 5.怎么改变滚动条的颜色,只有ie5.5版本以上才能支持。    
  51.  这是使用CSS语言,在次说明一下,它和我的浏览器版本有一定的关系。    
  52.  scrollbar-arrow-color:上下按钮上三角箭头的颜色。    
  53.  scrollbar-base-color:滚动条的基本颜色。    
  54.  scrollbar-dark-shadow-color:立体滚动条强阴影的颜色    
  55.  scrollbar-face-color:立体滚动条凸出部分的颜色    
  56.  scrollbar-highlight-color:滚动条空白部分的颜色    
  57.  scrollbar-shadow-color立体滚动条阴影的颜色。   
  58.  scrollbar-track-color:#99CC33;   
  59.  scrollbar-3dlight-color:#A8CBF1;    
  60.  代码如下:    
  61.  <style>    
  62.  <!--    
  63.  BODY {   
  64.  scrollbar-face-color:#99CC33;//(立体滚动条凸出部分的颜色)    
  65.  scrollbar-highlight-color:#A8CBF1;//(滚动条空白部分的颜色)    
  66.  scrollbar-shadow-color:#A8CBF1;//(立体滚动条阴影的颜色)    
  67.  scrollbar-arrow-color:#FF9966;//(上下按钮上三角箭头的颜色)    
  68.  scrollbar-base-color:#A8CBF1; //(滚动条的基本颜色)    
  69.  scrollbar-darkshadow-color:#A8CBF1; //(立体滚动条强阴影的颜色)   
  70.  scrollbar-track-color:#99CC33;   
  71.  scrollbar-3dlight-color:#A8CBF1;    
  72.  }    
  73.  -->    
  74.  </style>    
  75. 6. 获得一个窗口的大小   
  76.  document.body.clientWidth; document.body.clientHeight   
  77. 7.如何设定打开页面的大小   
  78.  <body onload="top.resizeTo(300,200);">   
  79.  打开页面的位置<body onload="top.moveBy(300,200);">   
  80. 7.电子邮件处理提交表单   
  81.  <form name="form1" method="post" action="mailto:****@***.com" enctype="text/plain">    
  82.  <input type=submit>   
  83.  </form>   
  84. 8.怎样去掉图片链接点击后,图片周围的虚线?   
  85.  <a href="#" onFocus="this.blur()"><img src="logo.jpg" border=0></a>   
  86. 9. 网页不会被缓存   
  87.  <META HTTP-EQUIV="pragma" CONTENT="no-cache">   
  88.  <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">   
  89.  <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">   
  90.  或者<META HTTP-EQUIV="expires" CONTENT="0">   
  91. 10.删除时确认   
  92.  <a href='javascript:if(confirm("确实要删除吗?"location="boos.asp?&areyou=删除&page=1"'>删除</a>   
  93. 11. 网页将不能被另存为   
  94.  <noscript><iframe src=*.html></iframe></noscript>    
  95. 12. 防止被人frame   
  96.  <SCRIPT LANGUAGE=javascript><!--    
  97.  if (top.location != self.location)top.location=self.location;   
  98.  // --></SCRIPT>   
  99.  1. oncontextmenu="window.event.returnvalue=false" 将彻底屏蔽鼠标右键   
  100.  <table border oncontextmenu=return(false)><td>no</table> 可用于Table   
  101.     
  102. 13. <body onselectstart="return false"> 取消选取、防止复制   
  103.     
  104. 14. onpaste="return false" 不准粘贴   
  105.     
  106. 15. oncopy="return false;" oncut="return false;" 防止复制   
  107.     
  108. 16. <link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标   
  109.     
  110. 17. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标   
  111.     
  112. 18. <input style="ime-mode:-Disabled"> 关闭输入法  
×
腾讯微博