![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
[ 05 ] JS&HTML&CSS
[ 05 ] JS&HTML&CSS
安得权
悲观者往往正确 乐观者往往成功
展开
-
fieldset legend 带半边框样式
<style> fieldset { padding: 10px; margin: 20px; color: #333; border: #06c dashed 1px; padding: 20px; } legend { color: #06c; font-weight: 800; background: #fff; padding: 2px 20px 2px 20px; border: #09c solid 1px; font-size: 14pt; } ul { .原创 2021-05-20 15:50:05 · 233 阅读 · 0 评论 -
表单控件 文本框 title overall type: UNKNOWN_TYPE server type: NO_SERVER_DATA
表单控件 title 会 自动添加信息如下: overall type: UNKNOWN_TYPE server type: NO_SERVER_DATA heuristic type: UNKNOWN_TYPE label: 账 号 parseable name: LoginName field signature: 1679789274 fo原创 2017-06-19 14:04:54 · 1490 阅读 · 0 评论 -
缩小窗口时CSS背景图出现右侧空白BUG的解决方法
转载地址:http://www.5icool.org/a/201305/a1868.html页面容器(#wrap)与页面头部(#header )为100%宽度。而内容的容器(#page)为固定宽度960px。浏览窗口缩小而小于内容层宽度时会产生宽度理解上的差异。如下图所示窗口宽度大于内容层宽度:改变浏览器窗口的大小,小于内容层宽度,如下图所示。拖转载 2015-10-19 13:44:32 · 2419 阅读 · 0 评论 -
CSS样式覆盖规则
大家都知道CSS的全称叫做“层叠样式表”,但估计很多人都不知道“层叠”二字的含义。其实,“层叠”指的就是样式的覆盖,当一个元素被运用上多种样式,并且出现重名的样式属性时,浏览器必须从中选择一个属性值,这个过程就叫“层叠”。样式覆盖(这种叫法更大众化些)遵循一定的规则,之前我对这个规则一直似懂非懂的,直到这几天看了”CSS: The Missing Manual”,才豁然开朗。下面是我的一些学习笔记转载 2015-05-26 17:32:42 · 2394 阅读 · 0 评论 -
前端编码规范之CSS
转载地址:http://www.cnblogs.com/hustskyking/p/css-spec.html"字是门面书是屋",我们不会去手写代码,但是敲出来的代码要好看、有条理,这还必须得有一点约束~ 团队开发中,每个人的编码风格都不尽相同,有时候可能存在很大的差异,为了便于压缩组件对代码进行压缩以及书写样式的规范统一和美观,很有必要大家一起来研究一套基本规范(模转载 2015-04-27 15:06:37 · 657 阅读 · 0 评论 -
css布局之左侧固定右侧自适应布局
1.固定高度> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>左侧固定+右侧栏自适应宽度title> style type="text/css"> * { margin:0; padding:0; } #mainBody { margin:0 a转载 2014-11-08 21:36:31 · 760 阅读 · 0 评论 -
HTML Table td 自动换行(中英文)
Html代码 table width="200px" border="1" > tr> td style="word-break:break-all; word-wrap:break-word;" >序号序号序号序号序号序号序号序号序号序号序号序号序号序号序号序号序号td> td style="word-break:break-all; word-w转载 2014-10-11 10:38:00 · 1046 阅读 · 0 评论 -
HTML自定义标签与标签自定义属性
大部分浏览器支持自定义HTML标签和为标准标签自定义属性,而且很多浏览器对这两种自定义行为的支持都很直接了当。自定义HTML标签在firefox、chrome这种现代浏览器里,自定义标签很简单,就像标准的标签那样写就可以了,而且CSS和JavaScript存取自定义标签和标准标签并无二致。1234567转载 2014-01-16 11:14:51 · 20675 阅读 · 0 评论 -
HTML自定义标签开发入门实例 .
1.写在最前面自定义标签这个词大家不会陌生,但我们接触更多的是自定义JSP标签.本文介绍种自定义HTML标签的方法。在页面设计与布局的过程中,使用这种方法,将大大精简你的页面代码量并使你的代码极具个性,酷到极点.2.具体步骤2.1.声明标签在标签中进行这样的申明:,xmlns即xml name space的缩写。是HTML标记的命名空间属性:一般其声明在元素开始标记的地方。只要在这转载 2014-01-16 10:32:42 · 1211 阅读 · 0 评论 -
clearfix:after 清除css浮动
在写HTML代码的时候,发现在Firefox等符合W3C标准的浏览器中,如果有一个DIV作为外部容器,内部的DIV如果设置了float样式,则外部的容器DIV因为内部没有clear,导致不能被撑开。看下面的例子:TEST DIVCSSBBSTEST DIVTEST DIVTEST DIV运行这段代码,大家可以看到,作为外部容器的边框为红色的DIV,没有被撑开。这是因转载 2013-12-13 09:47:25 · 671 阅读 · 0 评论 -
这样解决浏览器不兼容问题
浏览器兼容性问题怎么解决?如果想解决浏览器的兼容性问题,你首先要明白在一个浏览器显示正常的代码为什么会在其他浏览器出现浏览器不兼容的问题?这是因为各个浏览器对于HTML标签或者DIV盒子模型的解析不同造成的,经常会出现问题的浏览器非IE莫属,因为IE浏览器本身自有的layout,真的是让很多前端人员痛苦不堪。鉴于此我列举一些常用的检测不兼容代码的方法!1.排除法,逐行删除标签检测出转载 2013-08-09 15:24:26 · 2119 阅读 · 0 评论 -
DIV的内容自动换行
word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行它们的区别就在于:1,word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的转载 2013-08-01 13:48:45 · 1330 阅读 · 0 评论 -
textarea 在浏览器中固定大小和禁止拖动
HTML 标签 textarea 在大部分浏览器中只要指定行(rows)和列(cols)属性,就可以规定 textarea 的尺寸,大小就不会改变,不过更好的办法是使用 CSS 的 height 和 width 属性,但是Chrome,Safari和FireFox渲染的效果不同,可以拖动右下角图标改变大小。但是过分拖动大小会影响页面布局,使页面变得不美观。可以通过添加如下两个样式禁用拖动,固定大小转载 2013-07-03 10:45:49 · 213494 阅读 · 4 评论 -
CSS text-decoration: blink 只在火狐中闪烁
火狐中文字闪烁 去掉 text-decoration: blink;即可原创 2013-05-15 11:13:10 · 2351 阅读 · 0 评论 -
盒子模型 元素的定位 z-index空间位置
原创 2013-05-12 17:10:53 · 1172 阅读 · 0 评论 -
HTML特殊字符编码对照表
HTML特殊字符编码对照表特殊符号命名实体十进制编码特殊符号命名实体十进制编码特殊符号命名实体十进制编码ΑΑΑΒΒΒΓΓΓΔΔΔΕΕΕΖΖ&#转载 2013-03-25 09:39:06 · 853 阅读 · 0 评论 -
(最新整理)国内网页设计网站网址大全
一、网页设计类蓝色理想 http://www.blueidea.com 网页设计师联盟 http://www.68design.net网页设计大本营 http://www.code-123.com我爱设计网 http://www.52design.com视觉中国 http://www.chinavisual.com设计在线 http://www.dolcn.com转载 2013-01-14 15:22:54 · 2260 阅读 · 1 评论 -
网站设计:提高网页打开速度的技巧
互联网带宽越来越宽,似乎让网页的加载速度得到了质的飞跃。其实不然,因为随着带宽的提高,网页上的对象也越来越多,因此加快网页打开速度还是一个重要的课题。加快网页的打开速度,有三个路径,一是提高网络带宽,二是用户在本机做优化,三是网站设计者对网页做一定的优化。这篇文章站在一个网站设计者的角度,分享一些优化网页加载速度的小技巧。 一、优化图片 几乎没有哪个网页上是没有图片的。如果转载 2013-01-14 14:51:21 · 642 阅读 · 0 评论 -
Web应用界面设计规范—给项目组培训
Web应用界面设计规范(Design Specification for Web UI)主讲人:ARay目录:一、软件界面规范的重要性及其目的二、用户体验为何如此重要三、Web规范体系介绍四、界面设计开发流程五、应该遵循的基本原则六、界面设计规范一、软件界面规范的重要性及其目的 ①使最终设计出来的界面风格一致化,开发编码人员相互之间开发更轻松,遵转载 2012-12-27 11:26:59 · 705 阅读 · 0 评论 -
给自己的网站 地址栏加自定义图标
转载 2012-09-04 15:30:14 · 586 阅读 · 0 评论 -
自动适应大小,适应各种浏览器的按钮
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-i原创 2012-08-17 14:27:50 · 655 阅读 · 0 评论 -
HTML 字符实体
诸如 “为了在 HTML 中显示小于号 (http://www.w3school.com.cn/html/html_entities.asp转载 2012-08-17 09:18:22 · 436 阅读 · 0 评论 -
IE和火狐对padding的解析<转>
原文地址:http://www.ecshopdev.com/article-495.html 在页面设计时候,布局和css都正确,可就是在不同的浏览器中显示的效果不一样,错位啦,间距不一致啦都有,这就是各种浏览器对同一属性的解析不同 造成了浏览器不兼容。这里来说一下IE和火狐度padding的解析吧。fixfox的对DIV总高度是padding-top+height的,而I转载 2012-08-07 15:45:57 · 723 阅读 · 0 评论 -
固定table td的宽度
设置table 的 style="table-layout:fixed;" 然后设置td的 style="word-wrap:break-word;" 详细出处参考:http://www.jb51.net/web/72879.html原创 2012-07-12 11:30:09 · 488 阅读 · 0 评论 -
文本框挡住下拉列表
frameborder="0" src="about:blank" mce_src="about:blank">原创 2012-06-28 14:16:12 · 575 阅读 · 0 评论 -
如何让li中内容显示超过长度后以省略号显示
文字溢出时显示省略号重点:li { width: 200px; (定义宽度) white-space: nowrap; (不换行,一行显示) text-overflow: ellipsis; (溢出用省略号) -o-text-overflow: ellipsis; overflow: hidden转载 2012-06-13 09:53:37 · 1558 阅读 · 0 评论 -
CSS 文本两端对齐
text-align:justify;text-justify:inter-ideograph设置在文本所在的div上即可转载 2012-06-05 14:11:32 · 552 阅读 · 0 评论 -
HTMl5的sessionStorage和localStorage
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage。sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。而localStorage用于持久化的本地存转载 2012-03-30 09:31:01 · 1547 阅读 · 0 评论 -
[HTML] 使用HTML5的本地存储localStorage
在HTML5中引入了localStorage,其实这个概念很早就有,从最初的Cookies,到后来IE的userData,再到Google的Gears,直到现在的localStorage,从概念上都是一脉相承的。只不过现在在HTML5中将它制定成了标准,结束了以前各行其是的状态。 要使用HTML5的localStorage,首先自然是检测浏览器是否支持本地存储。各主流浏览器对localS转载 2012-03-30 09:22:05 · 13179 阅读 · 0 评论 -
写出优秀的CSS代码的13个建议
很多的前端工程师都对写出优秀的CSS代码感到困惑,因为他们既想让CSS的结构极致精简,又希望写出的代码不会浪费,所以总是顾此失彼。其实,CSS写起来并不难,但在大型项目中,就变得难以管理,特别是不同的人在CSS书写风格上稍有不同,团队上就更加难以沟通,为此总结了一些如何实现高效整洁的CSS代码原则:1. 使用Reset但并非全局Reset不同浏览器元素的默认属性有所不同,使用Reset可重转载 2012-02-23 14:36:56 · 860 阅读 · 0 评论 -
Test
$(document).ready(function () { $("#SET tr:odd").addClass("color1"); $("#SET tr:even").addClass("color2"); $("#SET tr").hover(function () { $(th原创 2011-06-15 23:05:00 · 602 阅读 · 0 评论 -
outHtml,innerHtml,innerText
关键字: dom,htmlinnerHtml,outerHtml,innerText这些都是相对于某个标签的id而言的,以下代码是可以直接运行看到区别的: This is a DIV! 从网上找到一张图片可以说明一些问题:其中这些都是以id="testdiv"的div来定位的。转载 2011-04-07 17:41:00 · 714 阅读 · 0 评论 -
使用Javascript 和 jQuery 通过 下拉框 的值 模糊匹配
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>wellwin</title> <style> </style> <script src="jquery/dist/jquery.js"></script></head><body> <.原创 2021-04-27 15:35:31 · 514 阅读 · 0 评论 -
JQuery上传插件Uploadify使用详解
转载地址:http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.htmlUploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示。不过官方提供的实例时php版本的,本文将详细介绍Uploadify在Aspnet中的使用,您也可以点击下面的链接进行演示或下载。官方下载官方文档官方演示首先按下面转载 2016-03-23 16:33:33 · 731 阅读 · 0 评论 -
破解&屏蔽防止嵌入框架代码 top.location != self.location
if (top.location != self.location) top.location = self.location;原创 2015-09-01 12:47:08 · 4699 阅读 · 0 评论 -
前端编码规范之Javascript
转载地址:http://www.cnblogs.com/hustskyking/p/javascript-spec.html 上次浅谈了下关于CSS的编码规范,大部分童鞋持赞同意见,仍存在一些童鞋不太理解这些规范的意义。 如果是个人或者小作坊开发,其实这些所谓的编码规范也没啥意思,因为大家写好的代码直接就给扔到网上去了,很少有打包、压缩、校检等过程,别人来修改你代码的情况也比较少转载 2015-04-27 15:08:54 · 616 阅读 · 0 评论 -
Js/Jquery获取iframe中的元素
在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素、或者在iframe框架中使用父窗口的元素。js在父窗口中获取iframe中的元素1.Js代码 格式:window.frames["iframe的name值"].document.getElementById("iframe中控件的ID").click();转载 2014-12-16 12:59:48 · 906 阅读 · 0 评论 -
js调用父框架函数与弹窗调用父页面函数的方法
js调用父框架函数与弹窗调用父页面函数的方法2010-08-10 15:55调用父级中的 aaa的函数子页面中:onclick="window.parent.frames.aaa()"父页面中:function aaa(){alert(‘bbbbb’);}----------------------------------转载 2014-11-07 08:45:33 · 843 阅读 · 0 评论 -
DOM对象和JQuery对象的区别
jQuery对象和DOM对象使用说明,需要的朋友可以参考下。1.jQuery对象和DOM对象第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQuery对象和DOM对象以及它们之间的关系.DOM对象,即是我们用传统的方法(javascript)获得的对象,jQuery对象即是用jQuery类库的选择器获得的对象;复制代码 代码如下:转载 2012-08-06 11:35:00 · 397 阅读 · 0 评论 -
jQuery UI使用总结
参考地址:http://www.runoob.com/jqueryui/example-datepicker.html DIV 中 直接显示 : 文本框显示: $("原创 2016-08-09 15:55:51 · 524 阅读 · 0 评论