小编Jac*_*ney的帖子

将一个未知大小的大图像置于较小的div内,并隐藏溢出

我想在没有javascript没有背景图像的div中居中一个img .

这是一些示例代码

<div> 
    <img src="/happy_cat.png"/> 
</div>
Run Code Online (Sandbox Code Playgroud)
  • 我不知道img的大小,它应该能够超过父级的宽度
  • 我不知道父div的宽度(它是100%)
  • 父div具有固定的高度
  • 图像大于父图像,父图像溢出:隐藏
  • 只需要支持现代浏览器

期望的结果.(忽略不透明等,只需注意定位).

在此输入图像描述

我知道这可以通过背景图像轻松完成,但这对我来说不是一个选择.我也可以使用javascript,但它似乎是一个非常沉重的方式来实现这一点.

谢谢!

插口

html css css3

72
推荐指数
2
解决办法
6万
查看次数

使用媒体查询内联样式

我知道这听起来很荒谬,但是我可以在内联样式中使用css媒体查询吗?原因是我正在回应PHP的背景,如果设备是视网膜,需要使用视网膜大小的图像.

ie: <div style="background:url(normal.png); <- need to add style for retina device

html css media-queries

17
推荐指数
1
解决办法
4万
查看次数

单击项目的Android操作栏自定义下拉视图

我正在为平板电脑编写一款Android应用.我已经使用操作栏创建了我的图标.但是,我需要在单击其中一个菜单项时打开自定义视图.

我不想要自定义操作栏 - 当单击"浏览主题"操作栏项时,我需要为自定义视图充气.此视图需要显示为下拉列表,但使用我自己的自定义布局,因为它不会用于导航.

下拉式菜单

这是我的menu.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@+id/menu_browse"
        android:title="Browse Subjects"
        android:showAsAction="always"
        android:actionLayout="@layout/action_layout_browse"
        android:actionProviderClass="au.com.pearson.f12catalogue.action_providers.BrowseProvider"
            />
    <item android:id="@+id/menu_settings"
        android:title="Settings"
        android:orderInCategory="100"
        android:showAsAction="never" />
</menu>
Run Code Online (Sandbox Code Playgroud)

我假设ActionProviderClass允许我在单击操作栏项时实例化自定义视图但我无法解决问题 - 也许我走错了路.

任何帮助将MUCH感激!谢谢!

更新:感谢动作栏样式的链接,但我不想简单地设置下拉样式.我想夸大自定义视图.该视图还将执行数据库查询等.

android android-3.0-honeycomb android-actionbar

16
推荐指数
1
解决办法
1万
查看次数

如何在Spring中缩小动态HTML响应?

按照Google的pagespeed建议,我想缩小我的Spring应用程序的HTML响应.我不是指GZip,我的意思是在HTML发送之前从HTML中删除注释和空格.

我想动态地这样做,而不是在我的模板中.我的模板包含许多有用的注释,但不应该是响应的一部分.

这是我的控制器.谢谢

@Controller
public class IndexController {

    @GetMapping("/")
    public ModelAndView index() {
        Data data = ....
        return new ModelAndView("index", data);
    }
}
Run Code Online (Sandbox Code Playgroud)

html java spring minify spring-boot

16
推荐指数
1
解决办法
1029
查看次数

transform:translateX vs left属性的转换.哪个有更好的表现?CSS

我正在制作一个带有HTML和CSS3的幻灯片菜单 - 尤其是过渡.

我想知道什么是最佳实践/最佳性能水平滑动相对定位的div.当我点击一个按钮时,它会向我的div添加一个类.哪个班级更好?(注意我可以稍后添加所有浏览器前缀,此网站仅针对现代浏览器).

//option 1
.animate{
    -webkit-transition:all ease 0.3s;
    -webkit-transform:translateZ(200px);
}

//option 2
.animate{
    -webkit-transition:all ease 0.3s;
    left:200px;
}
Run Code Online (Sandbox Code Playgroud)

谢谢

css css3 css-transitions css-transforms

14
推荐指数
1
解决办法
3万
查看次数

9-Patch可绘制尺寸Android.不同密度如何处理未拉伸区域?

在此输入图像描述

考虑上面的图像. - 虚线划分了9-Patch png,我将从photoshop文件中切出.我需要它来创建一个弹出框. - 该盒子包含一个dropShadow,如本照片中的测量工具所示. - 粉色线条用于显示我将如何使用draw9Patch工具创建9-Patch.

我的问题是:如果我有一个带有9-Patch的View"Container"作为背景我需要确保它的子视图总是在白框内.我打算用这个填充.我打算将填充设置为与测量工具相等.因此,如果它在photoshop中为30px,我会layout_paddingLeft"=30dp"为容器设置.(设计是在MDPI,所以我假设这个转换是可以的).但是,不同密度的屏幕如何处理9路径.例如,测量面积是30px还是30dip

android drawable nine-patch

14
推荐指数
1
解决办法
4786
查看次数

扩展Android View类以添加一个drophadow

我想进行扩展,LinearLayout以便在绘制布局时在其下方添加一个投影.我玩过这种onDraw方法但是我有点迷失了.任何有关这个甚至图书馆建议的帮助将不胜感激!

这是我想要实现的投影视图的示例.我不相信我可以在这里使用九个补丁因为我需要视图的内容在白框内.这意味着我需要知道边界与PNG末端之间的距离.但是我相信不同的屏幕密度意味着这个距离将始终是相同的PX但不是相同的DP.

所以要清楚我需要一种方法来扩展View类,以便在将它添加到布局时在其下面绘制阴影.请不要使用XML或9Patch解决方案.

在此输入图像描述

谢谢

插口

inheritance android view android-layout android-view

11
推荐指数
1
解决办法
1万
查看次数

CodeMirror具有内容,但在按下之前不会显示

我有一个嵌入在我正在构建的webapp中的CodeMirror实例.它工作得很好 - 除了在用户输入新字符之前不会显示初始内容.所以它一直存在,但隐藏直到用户强制改变.这是不好的.有没有什么办法可以强制重新模仿或刷新模拟字符输入的浏览器 - 空白会做.

这是代码......

<textarea id='code-mirror' ><?php echo $contents; ?></textarea>
<script>
    jQuery(document).ready(function(){
        var textarea = document.getElementById('code-mirror');
        var myCodeMirror = CodeMirror.fromTextArea(textarea,    
            {  
            onUpdate:codemirrorcallback,
            });
        // myCodeMirror.refresh(); ? is this an option?
     });
</script>
Run Code Online (Sandbox Code Playgroud)

这将生成一个工作编辑器,用于保存内容并在文本区域内显示已保存的内容,但仅在用户开始编辑后显示.在此之前它只是空白.

任何帮助,甚至只是链接将受到高度赞赏.多谢你们!

UPDATE

在myCodeMirror上调用.refresh会在Chrome控制台中打印错误 Uncaught TypeError: Cannot call method 'focus' of undefined

javascript php jquery codemirror

10
推荐指数
2
解决办法
6932
查看次数

如何垂直对齐两个浮动的div?

我在容器div中有两个div.需要向右浮动另一个浮子.它们也需要在父母的内部垂直居中.我怎样才能做到这一点?

<div id='parent'>
    <div id='left-box' class='child'>Some text</div>
    <div id='right-box' class='child'>Details</div>    
</div>
Run Code Online (Sandbox Code Playgroud)

如果没有浮动应用于它们,则使用此css垂直对齐中间

.child{ display:inline-block; vertical-align:middle; }
Run Code Online (Sandbox Code Playgroud)

然而,添加#right-box{ float: right; }会导致孩子失去垂直对齐.我究竟做错了什么?

多谢你们

html css

9
推荐指数
1
解决办法
2万
查看次数

在php类中使用html是不是很糟糕?

在类函数中使用html有什么问题吗?我在DOM中调用它,所以我不需要返回一个字符串.

public function the_contact_table(){
    ?>
    <div>
        some html here
    </div>
    <?php
}
Run Code Online (Sandbox Code Playgroud)

另外,当我需要字符串时,我使用这种方法?有更好的方法还是相对标准?

public function get_single(){
    ob_start();?>
        <div class='staff-member single'>
            <div class='col left'>
                <div class='thumbnail'>
                    thumbnail
                </div>
                <?php $this->the_contact_table(); ?>
            </div>
            <div class='col right'>

            </div>
        </div>      
    <?php
    $content = ob_get_contents();
    ob_end_clean();
    return $content;
}
Run Code Online (Sandbox Code Playgroud)

UPDATE

我应该解释为什么我这样做.我正在制作一个Wordpress插件,并希望控制一个帖子类型输出.所以我使用的是如下过滤器

public function filter_single($content){
     global $post;
     if ($post->post_type == 'staff-member') {

         $sm = new JM_Staff_Member($post);
         $content = $sm->get_single();
     }
     return $content;
}
Run Code Online (Sandbox Code Playgroud)

所以你可以看到,我必须将一个字符串返回到wordpress核心

php wordpress

7
推荐指数
1
解决办法
1805
查看次数