草庐IT

html - 在使用 contenteditable div 时模拟密码类型输入

我使用contenteditablediv而不是input元素,因为它们在输入框中的样式方面更加灵活。我只是想知道是否有办法让输入看起来像一个类型设置为密码的输入元素,如下所示:我希望这已经足够清楚了。谢谢。 最佳答案 您必须找出mozilla和co..的浏览器特定CSS设置,但在webkit中它看起来像这样。您还需要通过javascript添加按键处理程序。#password{-webkit-text-security:disc;height:20px;width:100px;-webkit-appearance:textfiel

css - 从屏幕左侧到居中 div 末端的线

我想从屏幕左侧到居中的div末端制作一条1px的线。div以margin:auto;为中心。这张图片显示了它的外观: 最佳答案 这是一个使用calc的例子:.box{width:200px;height:200px;border:1pxsolidblue;margin:0auto;}.line{border:1pxsolidred;width:calc(((100%-200px)/2)+200px);}JSFiddleBrowsersupport 关于css-从屏幕左侧到居中div末端的

css - 从屏幕左侧到居中 div 末端的线

我想从屏幕左侧到居中的div末端制作一条1px的线。div以margin:auto;为中心。这张图片显示了它的外观: 最佳答案 这是一个使用calc的例子:.box{width:200px;height:200px;border:1pxsolidblue;margin:0auto;}.line{border:1pxsolidred;width:calc(((100%-200px)/2)+200px);}JSFiddleBrowsersupport 关于css-从屏幕左侧到居中div末端的

css - 绝对div不随页面滚动

从下面的fiddle中,我试图使“内部导航”div绝对定位,以便它固定在“比较显示”框中。我遇到的问题是,当您滚动时,“内部导航”div不会保持固定。我该如何解决这个问题?这是我的fiddle:http://jsfiddle.net/Cd9eZ/HTML代码CSS代码.table{display:table;height:100%;width:100%;}.table>div{display:table-cell;vertical-align:top;}.table>.col-50{width:50%;background:green;}.compare-display{positio

css - 绝对div不随页面滚动

从下面的fiddle中,我试图使“内部导航”div绝对定位,以便它固定在“比较显示”框中。我遇到的问题是,当您滚动时,“内部导航”div不会保持固定。我该如何解决这个问题?这是我的fiddle:http://jsfiddle.net/Cd9eZ/HTML代码CSS代码.table{display:table;height:100%;width:100%;}.table>div{display:table-cell;vertical-align:top;}.table>.col-50{width:50%;background:green;}.compare-display{positio

javascript - 使用javascript创建动态div

functionselecteditems(){vari=1;varval="";while(i如何创建一个新的div并向其中添加内容?在上面的例子中,由于innerHTML,我丢失了以前的内容。我每次都想要新的div来动态附加图像和上面的变量val。提前致谢。 最佳答案 检查这个Demowindow.onload=function(){varoutput=document.getElementById('output');vari=1;varval="";while(i 关于javas

javascript - 使用javascript创建动态div

functionselecteditems(){vari=1;varval="";while(i如何创建一个新的div并向其中添加内容?在上面的例子中,由于innerHTML,我丢失了以前的内容。我每次都想要新的div来动态附加图像和上面的变量val。提前致谢。 最佳答案 检查这个Demowindow.onload=function(){varoutput=document.getElementById('output');vari=1;varval="";while(i 关于javas

html - 使用变换 : translateY(-50%); inside absolutely positioned div 垂直对齐

我正在尝试使用以下代码将h2垂直居中放置在高度为50%的div中:#owl-demoh2{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}在Chrome上工作正常,但h2在SafariIOS中消失,除非我将h2设置为绝对定位,然后我无法使用text-align将文本居中。非常感谢任何帮助,我一整天都在努力完成这项工作。编辑:所以看起来高度50%是父div的问题,如果我删除它,文本会出现在IOS中。

html - 使用变换 : translateY(-50%); inside absolutely positioned div 垂直对齐

我正在尝试使用以下代码将h2垂直居中放置在高度为50%的div中:#owl-demoh2{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}在Chrome上工作正常,但h2在SafariIOS中消失,除非我将h2设置为绝对定位,然后我无法使用text-align将文本居中。非常感谢任何帮助,我一整天都在努力完成这项工作。编辑:所以看起来高度50%是父div的问题,如果我删除它,文本会出现在IOS中。

javascript - jQuery .height() 在 div 上输出与 .scrollHeight 相同的值并溢出 :auto (IE8)

在绕过许多其他问题后,我还没有找到解决我问题的答案。我正在编写一个脚本来查明div是否溢出。但是当尝试使用jQuery.height()、jQuery.innerHeight()或JavaScriptsoffsetHeight检索可见高度时。我得到了整个div的值(包括溢出的部分),即:与scrollHeight相同的值。包含的DIV样式:{overflow-x:hidden;overflow-y:auto;width:73%;bottom:0px;float:left;height:100%;top:0px;}我在jsFiddle上创建了场景模型:http://jsfiddle.ne