Tag: css3

在iOS和Android设备浏览器中隐藏<hr>标签: IOS和Android设备中隐藏的标签浏览器代码如下 HTML <hr class="separator_border"> CSS .separator_border { background-color: #FFFFFF; border: 3px none; } 上面的代码在我们更改Desktop中的用户代理时正在工作。在实际的Android和iOS设备浏览器中，它没有显示hr。但在less数Android设备中，“hr”标签是可见的，并不是在所有设备中都会发生。任何人都可以提出解决scheme

obj-c中的静态背景图像位置（类似于background-attachment：fixed）: 我想创造一个观点，即不pipe它如何移动，都将保持其在相同位置的背景图像。所以，如果视图被拖动，背景保持放置，类似于css3中的background-attachment:fixed 。我的问题是， clipsToBounds = YES似乎不工作。图像仍然占据了整个屏幕，并没有被剪切到父母的框架。有任何想法吗？ @implementation StaticBackgroundView { UIImageView *imageView; } // Must be init'd from code or won't work – (id)initWithFrame:(CGRect)frame { self = [super initWithFrame:frame]; if (self) { imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"myImage.png"]]; imageView.clipsToBounds = YES; self.clipsToBounds = YES; [self addSubview:imageView]; [self sendSubviewToBack:imageView]; } return self; } – […]

为什么flex会影响iOS的字体大小？: 在Safari iOS上使用flexbox确认字体大小受到某种影响后，我感到非常震惊 iOS版桌面码 a { font-size: 14px; } a + a { margin-left: 1em; } .flex { display: flex; } .float > a { float: left; } .float:after { content: ""; display: block; clear: both; } <div> <a href="#">hola</a> <a href="#">adios</a> <a href="#">hola</a> <a href="#">adios</a> <a href="#">hola</a> <a href="#">adios</a> <a href="#">hola</a> <a href="#">adios</a> […]

需要在ios7 +中修正头文件: 即使出现键盘，我也需要将标题固定在顶部。每当我点击文本框，键盘就会出现，包括标题在内的整个页面正在移动到顶部，只有通过滚动页面才能看到它。我已经确定头像的位置。什么是最好的解决scheme，以解决这个问题在ios7 +没有使用客观C.我们已经尝试了任何解决scheme已经在这里提供：过渡到iOS 7：在iPad上查看jQuery / iPhone Webapps的正确视口设置但它没有工作。任何帮助表示赞赏。提前致谢。

在CSS3中滑动animation: 我目前正在研究用HTML 5，CSS3和jQuery编写的移动应用程序框架。对于“屏幕”的标记，我有以下布局： <div class="page" id="home"> <!– some content is here… –> </div> <div class="page" id="lists"> <!– some more content is here… –> </div> 我目前正在使用jQuery来检测页面上的第一个div元素，并将其class属性设置为current 。然后我有下面的CSS声明隐藏除了page.current任何东西： div.page { display: none; } div.page.current { display: block; } 每当浏览器检测到哈希更改事件（ window.onhashchange ），我运行以下jQuery： if(window.location.hash) { var the_hash = window.location.hash.substring(1); if($('#' + the_hash).length > 0) { $('.current').removeClass('current'); $('#' + […]

我如何重新定位固定的页眉和页脚？: 我使用固定页眉和页脚时遇到了一些问题，但是有些build议我使用Position：Absolute而不是Fixed，并且在使用JavaScript代码进行滚动时重新定位页眉和页脚，是否有人知道如何做到这一点？或者这个问题面对他。任何build议都会有所帮助。最好的祝福。

CSS，IOS，iPad，-webkit溢出滚动：触摸错误，大内容被切断: 我有一个有数千行（2317准确）的数据表来自数据库的表。我把这个表里面的一个div，所以它是可滚动的。 HTML： <div class="longList"> <!– table with thousands of rows –> </div> CSS： .longList {overflow: auto; height: 550px; margin: 0 auto; -webkit-overflow-scrolling: touch;} 问题是，列表在iPad上的移动Safari浏览器（在桌面浏览器上工作正常）切断行号1900（该行的一半显示），列表的其余部分显示为空白。第1900行之后没有显示行。如果我删除了“-webkit-overflow-scrolling：touch;”，则所有行都显示出来从风格。有没有人遇到这个或有任何想法如何解决这个问题？

CSS @keyframesanimation闪烁: 如何修复@-webkit-keyframesanimation闪烁在其迭代结束？在使用CSS3 transform值translate ， translate3d和opacity进行animation处理的Android 2上，这一点非常明显。您可能会注意到在一些post中的build议，以解决它： -webkit-transform: translate3d(0,0,0); 要么 -webkit-perspective: 1000; -webkit-backface-visibility: hidden; 但是在Android 2.3上进行testing之后，我注意到他们中没有一个真正解决了这个问题。

iOS Safariinput插入符号颜色: iPhone设备上的Safari有一个小的CSS问题。我的searchinput是蓝色的，当用户关注它时，插入符号几乎是不可见的：在所有桌面浏览器中，即使在桌面Safari上，它也具有正确的颜色（白色）。任何想法如何解决这个问题，并改变在iOS设备上的符号颜色？ input样式： input { background-color: $stateBlue; height: $navbarItemHeight; padding: 0 10px; vertical-align: bottom; color: $white; border-radius: $borderRadius; font-size: 1.1666666667em; // 16px -moz-appearance:none; -webkit-appearance:none; &::-webkit-input-placeholder { text-shadow: none; -webkit-text-fill-color: initial; } }

ios缓慢/不工作的CSS3转换: 我正尝试在自己制作的自适应网站上开始使用一些CSS3转换，并且所有function都在桌面版Chrome和Android版Chrome上运行良好，但是在Chrome和Safari的iOS设备上无法正常工作。例如，我用于我的菜单的CSS代码片段如下： #menu { width: 180px; height: 100%; position: fixed; top: 0; left: -180px; z-index: 9; transition: left 1s; -webkit-transition: left 1s; } 我有一个菜单button，当点击时，调用一个javascript函数，将“左”样式改为0，它将从屏幕左侧的外部转换到位置。一切工作正常，在桌面和Chrome浏览器的Android，但在iOS和Chrome浏览器，它要么是非常波涛汹涌，要么只是延迟一秒钟，然后立即popup。在我所有的转换中都是这样做的，但为了简单起见，我正在显示菜单。我已经做了大量的search和search堆栈，但我真正发现的唯一的东西说增加以下内容： -webkit-backface-visibility: hidden; -webkit-perspective: 1000; -webkit-transform: translate3d(0, 0, 0); 以强迫硬件加速的风格，但它也不工作。我没有看到任何改变。任何帮助，将不胜感激。