媒体查询的绝对定位

时间:2017-04-06 14:39:58

标签: html css

我无法使用媒体查询设置绝对元素。现在我有一个位于屏幕左上角的盒子。但是,当屏幕尺寸低于768px时,我希望此框粘在右上角。这是我的代码:

HTML

<div></div>

CSS

div {
  position: absolute;
  left: 0;
  top: 0;
  height: 200px;
  width: 200px;
  background: red;
}

@media (max-width: 768px) {
  div {
    right: 0;
  }
}

这是指向我的笔的链接:https://codepen.io/Hudson_Taylor11/pen/ZeNXwz

谢谢!

1 个答案:

答案 0 :(得分:1)

试试这个:

import android.support.v4.app.FragmentActivity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;

import com.google.android.gms.maps.OnStreetViewPanoramaReadyCallback;
import com.google.android.gms.maps.StreetViewPanorama;
import com.google.android.gms.maps.StreetViewPanoramaFragment;
import com.google.android.gms.maps.StreetViewPanoramaOptions;
import com.google.android.gms.maps.StreetViewPanoramaView;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.StreetViewPanoramaCamera;
import com.google.android.gms.maps.model.StreetViewPanoramaLocation;

public class MainActivity extends FragmentActivity
        implements OnStreetViewPanoramaReadyCallback {

    private static final String TAG = MainActivity.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        StreetViewPanoramaFragment streetViewPanoramaFragment =
                (StreetViewPanoramaFragment) getFragmentManager()
                        .findFragmentById(R.id.streetviewpanorama);
        streetViewPanoramaFragment.getStreetViewPanoramaAsync(this);

    }

    @Override
    public void onStreetViewPanoramaReady(final StreetViewPanorama panorama)  {
        final long duration = 1000;
        float tilt = 30;
        float bearing = 90;
        final StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder()
                .zoom(panorama.getPanoramaCamera().zoom)
                .bearing(bearing)
                .tilt(tilt)
                .build();

        panorama.setPosition(new LatLng(52.208818, 0.090587));
        panorama.setStreetNamesEnabled(false);
        panorama.setZoomGesturesEnabled(false);

        panorama.setOnStreetViewPanoramaChangeListener(new StreetViewPanorama.OnStreetViewPanoramaChangeListener() {
            @Override
            public void onStreetViewPanoramaChange(StreetViewPanoramaLocation streetViewPanoramaLocation) {
                if (streetViewPanoramaLocation != null) {
                    panorama.animateTo(camera, duration);
                }
                Log.d(TAG, "TESTINGGGGGGGGGG");
            }
        });
    }
}