屏幕_屏幕尺子 - CSDN
精华内容
参与话题
  • 最简单的基于FFmpeg的AVDevice例子(屏幕录制)

    万次阅读 多人点赞 2016-03-12 14:35:02
    FFmpeg中有一个和多媒体设备交互的类库:Libavdevice。使用这个库可以读取电脑的多媒体设备的数据,或者输出数据到指定...本篇文章记录一个基于FFmpeg的Libavdevice类库录制屏幕的例子。本文程序录制当前桌面内容并且解

    =====================================================
    最简单的基于FFmpeg的AVDevice例子文章列表:

    最简单的基于FFmpeg的AVDevice例子(读取摄像头)

    最简单的基于FFmpeg的AVDevice例子(屏幕录制)
    =====================================================

    
    FFmpeg中有一个和多媒体设备交互的类库:Libavdevice。使用这个库可以读取电脑的多媒体设备的数据,或者输出数据到指定的多媒体设备上。

    计划写2个有关FFmpeg的libavdevice类库的例子。上篇文章记录了一个基于FFmpeg的Libavdevice类库读取摄像头数据的例子。本篇文章记录一个基于FFmpeg的Libavdevice类库录制屏幕的例子。本文程序录制当前桌面内容并且解码显示出来。有关解码显示方面的代码本文不再详述,可以参考文章:
    100行代码实现最简单的基于FFMPEG+SDL的视频播放器(SDL1.x)

    抓屏方法

    上篇文章记录了libavdevice的使用方法,本文不再重复。在Windows系统使用libavdevice抓取屏幕数据有两种方法:gdigrab和dshow。下文分别介绍。
    1. gdigrab
    gdigrab是FFmpeg专门用于抓取Windows桌面的设备。非常适合用于屏幕录制。它通过不同的输入URL支持两种方式的抓取:
    (1)“desktop”:抓取整张桌面。或者抓取桌面中的一个特定的区域。
    (2)“title={窗口名称}”:抓取屏幕中特定的一个窗口(目前中文窗口还有乱码问题)。
    gdigrab另外还支持一些参数,用于设定抓屏的位置:
    offset_x:抓屏起始点横坐标。
    offset_y:抓屏起始点纵坐标。
    video_size:抓屏的大小。
    framerate:抓屏的帧率。
    参考的代码如下:

    //Use gdigrab
     AVDictionary* options = NULL;
     //Set some options
     //grabbing frame rate
     //av_dict_set(&options,"framerate","5",0);
     //The distance from the left edge of the screen or desktop
     //av_dict_set(&options,"offset_x","20",0);
     //The distance from the top edge of the screen or desktop
     //av_dict_set(&options,"offset_y","40",0);
     //Video frame size. The default is to capture the full screen
     //av_dict_set(&options,"video_size","640x480",0);
     AVInputFormat *ifmt=av_find_input_format("gdigrab");
     if(avformat_open_input(&pFormatCtx,"desktop",ifmt,&options)!=0){
      printf("Couldn't open input stream.(无法打开输入流)\n");
      return -1;
      }

    2. dshow
    使用dshow抓屏需要安装抓屏软件:screen-capture-recorder
    软件地址:http://sourceforge.net/projects/screencapturer/
    下载软件安装完成后,可以指定dshow的输入设备为“screen-capture-recorder”即可。有关dshow设备的使用方法在上一篇文章中已经有详细叙述,这里不再重复。参考的代码如下:
    AVInputFormat *ifmt=av_find_input_format("dshow");
     if(avformat_open_input(&pFormatCtx,"video=screen-capture-recorder",ifmt,NULL)!=0){
      printf("Couldn't open input stream.(无法打开输入流)\n");
      return -1;
     }

    注:上述两种抓屏方法也可以直接使用ffmpeg.exe的命令行完成,可以参考文章:

    FFmpeg获取DirectShow设备数据(摄像头,录屏)

    在Linux下可以使用x11grab抓屏,在MacOS下可以使用avfoundation抓屏,在这里不再详细叙述。

    代码

    下面直接贴上程序代码:

    /**
     * 最简单的基于FFmpeg的AVDevice例子(屏幕录制)
     * Simplest FFmpeg Device (Screen Capture)
     *
     * 雷霄骅 Lei Xiaohua
     * leixiaohua1020@126.com
     * 中国传媒大学/数字电视技术
     * Communication University of China / Digital TV Technology
     * http://blog.csdn.net/leixiaohua1020
     *
     * 本程序实现了屏幕录制功能。可以录制并播放桌面数据。是基于FFmpeg
     * 的libavdevice类库最简单的例子。通过该例子,可以学习FFmpeg中
     * libavdevice类库的使用方法。
     * 本程序在Windows下可以使用2种方式录制屏幕:
     *  1.gdigrab: Win32下的基于GDI的屏幕录制设备。
     *             抓取桌面的时候,输入URL为“desktop”。
     *  2.dshow: 使用Directshow。注意需要安装额外的软件screen-capture-recorder
     * 在Linux下可以使用x11grab录制屏幕。
     * 在MacOS下可以使用avfoundation录制屏幕。
     *
     * This software capture screen of computer. It's the simplest example
     * about usage of FFmpeg's libavdevice Library. 
     * It's suiltable for the beginner of FFmpeg.
     * This software support 2 methods to capture screen in Microsoft Windows:
     *  1.gdigrab: Win32 GDI-based screen capture device.
     *             Input URL in avformat_open_input() is "desktop".
     *  2.dshow: Use Directshow. Need to install screen-capture-recorder.
     * It use x11grab to capture screen in Linux.
     * It use avfoundation to capture screen in MacOS.
     */
    
    
    #include <stdio.h>
    
    #define __STDC_CONSTANT_MACROS
    
    #ifdef _WIN32
    //Windows
    extern "C"
    {
    #include "libavcodec/avcodec.h"
    #include "libavformat/avformat.h"
    #include "libswscale/swscale.h"
    #include "libavdevice/avdevice.h"
    #include "SDL/SDL.h"
    };
    #else
    //Linux...
    #ifdef __cplusplus
    extern "C"
    {
    #endif
    #include <libavcodec/avcodec.h>
    #include <libavformat/avformat.h>
    #include <libswscale/swscale.h>
    #include <libavdevice/avdevice.h>
    #include <SDL/SDL.h>
    #ifdef __cplusplus
    };
    #endif
    #endif
    
    //Output YUV420P 
    #define OUTPUT_YUV420P 0
    //'1' Use Dshow 
    //'0' Use GDIgrab
    #define USE_DSHOW 0
    
    //Refresh Event
    #define SFM_REFRESH_EVENT  (SDL_USEREVENT + 1)
    
    #define SFM_BREAK_EVENT  (SDL_USEREVENT + 2)
    
    int thread_exit=0;
    
    int sfp_refresh_thread(void *opaque)
    {
    	thread_exit=0;
    	while (!thread_exit) {
    		SDL_Event event;
    		event.type = SFM_REFRESH_EVENT;
    		SDL_PushEvent(&event);
    		SDL_Delay(40);
    	}
    	thread_exit=0;
    	//Break
    	SDL_Event event;
    	event.type = SFM_BREAK_EVENT;
    	SDL_PushEvent(&event);
    
    	return 0;
    }
    
    //Show Dshow Device
    void show_dshow_device(){
        AVFormatContext *pFormatCtx = avformat_alloc_context();
        AVDictionary* options = NULL;
        av_dict_set(&options,"list_devices","true",0);
        AVInputFormat *iformat = av_find_input_format("dshow");
        printf("========Device Info=============\n");
        avformat_open_input(&pFormatCtx,"video=dummy",iformat,&options);
        printf("================================\n");
    }
    
    //Show AVFoundation Device
    void show_avfoundation_device(){
        AVFormatContext *pFormatCtx = avformat_alloc_context();
        AVDictionary* options = NULL;
        av_dict_set(&options,"list_devices","true",0);
        AVInputFormat *iformat = av_find_input_format("avfoundation");
        printf("==AVFoundation Device Info===\n");
        avformat_open_input(&pFormatCtx,"",iformat,&options);
        printf("=============================\n");
    }
    
    
    
    int main(int argc, char* argv[])
    {
    
    	AVFormatContext	*pFormatCtx;
    	int				i, videoindex;
    	AVCodecContext	*pCodecCtx;
    	AVCodec			*pCodec;
    	
    	av_register_all();
    	avformat_network_init();
    	pFormatCtx = avformat_alloc_context();
    	
    	//Open File
    	//char filepath[]="src01_480x272_22.h265";
    	//avformat_open_input(&pFormatCtx,filepath,NULL,NULL)
    
    	//Register Device
    	avdevice_register_all();
    	//Windows
    #ifdef _WIN32
    #if USE_DSHOW
    	//Use dshow
    	//
    	//Need to Install screen-capture-recorder
    	//screen-capture-recorder
    	//Website: http://sourceforge.net/projects/screencapturer/
    	//
    	AVInputFormat *ifmt=av_find_input_format("dshow");
    	if(avformat_open_input(&pFormatCtx,"video=screen-capture-recorder",ifmt,NULL)!=0){
    		printf("Couldn't open input stream.\n");
    		return -1;
    	}
    #else
    	//Use gdigrab
    	AVDictionary* options = NULL;
    	//Set some options
    	//grabbing frame rate
    	//av_dict_set(&options,"framerate","5",0);
    	//The distance from the left edge of the screen or desktop
    	//av_dict_set(&options,"offset_x","20",0);
    	//The distance from the top edge of the screen or desktop
    	//av_dict_set(&options,"offset_y","40",0);
    	//Video frame size. The default is to capture the full screen
    	//av_dict_set(&options,"video_size","640x480",0);
    	AVInputFormat *ifmt=av_find_input_format("gdigrab");
    	if(avformat_open_input(&pFormatCtx,"desktop",ifmt,&options)!=0){
    		printf("Couldn't open input stream.\n");
    		return -1;
    	}
    
    #endif
    #elif defined linux
    	//Linux
    	AVDictionary* options = NULL;
    	//Set some options
    	//grabbing frame rate
    	//av_dict_set(&options,"framerate","5",0);
    	//Make the grabbed area follow the mouse
    	//av_dict_set(&options,"follow_mouse","centered",0);
    	//Video frame size. The default is to capture the full screen
    	//av_dict_set(&options,"video_size","640x480",0);
    	AVInputFormat *ifmt=av_find_input_format("x11grab");
    	//Grab at position 10,20
    	if(avformat_open_input(&pFormatCtx,":0.0+10,20",ifmt,&options)!=0){
    		printf("Couldn't open input stream.\n");
    		return -1;
    	}
    #else
        show_avfoundation_device();
        //Mac
        AVInputFormat *ifmt=av_find_input_format("avfoundation");
        //Avfoundation
        //[video]:[audio]
        if(avformat_open_input(&pFormatCtx,"1",ifmt,NULL)!=0){
            printf("Couldn't open input stream.\n");
            return -1;
        }
    #endif
    
    	if(avformat_find_stream_info(pFormatCtx,NULL)<0)
    	{
    		printf("Couldn't find stream information.\n");
    		return -1;
    	}
    	videoindex=-1;
    	for(i=0; i<pFormatCtx->nb_streams; i++) 
    		if(pFormatCtx->streams[i]->codec->codec_type==AVMEDIA_TYPE_VIDEO)
    		{
    			videoindex=i;
    			break;
    		}
    	if(videoindex==-1)
    	{
    		printf("Didn't find a video stream.\n");
    		return -1;
    	}
    	pCodecCtx=pFormatCtx->streams[videoindex]->codec;
    	pCodec=avcodec_find_decoder(pCodecCtx->codec_id);
    	if(pCodec==NULL)
    	{
    		printf("Codec not found.\n");
    		return -1;
    	}
    	if(avcodec_open2(pCodecCtx, pCodec,NULL)<0)
    	{
    		printf("Could not open codec.\n");
    		return -1;
    	}
    	AVFrame	*pFrame,*pFrameYUV;
    	pFrame=av_frame_alloc();
    	pFrameYUV=av_frame_alloc();
    	//unsigned char *out_buffer=(unsigned char *)av_malloc(avpicture_get_size(AV_PIX_FMT_YUV420P, pCodecCtx->width, pCodecCtx->height));
    	//avpicture_fill((AVPicture *)pFrameYUV, out_buffer, AV_PIX_FMT_YUV420P, pCodecCtx->width, pCodecCtx->height);
    	//SDL----------------------------
    	if(SDL_Init(SDL_INIT_VIDEO | SDL_INIT_AUDIO | SDL_INIT_TIMER)) {  
    		printf( "Could not initialize SDL - %s\n", SDL_GetError()); 
    		return -1;
    	} 
    	int screen_w=640,screen_h=360;
    	const SDL_VideoInfo *vi = SDL_GetVideoInfo();
    	//Half of the Desktop's width and height.
    	screen_w = vi->current_w/2;
    	screen_h = vi->current_h/2;
    	SDL_Surface *screen; 
    	screen = SDL_SetVideoMode(screen_w, screen_h, 0,0);
    
    	if(!screen) {  
    		printf("SDL: could not set video mode - exiting:%s\n",SDL_GetError());  
    		return -1;
    	}
    	SDL_Overlay *bmp; 
    	bmp = SDL_CreateYUVOverlay(pCodecCtx->width, pCodecCtx->height,SDL_YV12_OVERLAY, screen); 
    	SDL_Rect rect;
    	rect.x = 0;    
    	rect.y = 0;    
    	rect.w = screen_w;    
    	rect.h = screen_h;  
    	//SDL End------------------------
    	int ret, got_picture;
    
    	AVPacket *packet=(AVPacket *)av_malloc(sizeof(AVPacket));
    
    #if OUTPUT_YUV420P 
        FILE *fp_yuv=fopen("output.yuv","wb+");  
    #endif  
    
    	struct SwsContext *img_convert_ctx;
    	img_convert_ctx = sws_getContext(pCodecCtx->width, pCodecCtx->height, pCodecCtx->pix_fmt, pCodecCtx->width, pCodecCtx->height, AV_PIX_FMT_YUV420P, SWS_BICUBIC, NULL, NULL, NULL); 
    	//------------------------------
    	SDL_Thread *video_tid = SDL_CreateThread(sfp_refresh_thread,NULL);
    	//
    	SDL_WM_SetCaption("Simplest FFmpeg Grab Desktop",NULL);
    	//Event Loop
    	SDL_Event event;
    
    	for (;;) {
    		//Wait
    		SDL_WaitEvent(&event);
    		if(event.type==SFM_REFRESH_EVENT){
    			//------------------------------
    			if(av_read_frame(pFormatCtx, packet)>=0){
    				if(packet->stream_index==videoindex){
    					ret = avcodec_decode_video2(pCodecCtx, pFrame, &got_picture, packet);
    					if(ret < 0){
    						printf("Decode Error.\n");
    						return -1;
    					}
    					if(got_picture){
    						SDL_LockYUVOverlay(bmp);
    						pFrameYUV->data[0]=bmp->pixels[0];
    						pFrameYUV->data[1]=bmp->pixels[2];
    						pFrameYUV->data[2]=bmp->pixels[1];     
    						pFrameYUV->linesize[0]=bmp->pitches[0];
    						pFrameYUV->linesize[1]=bmp->pitches[2];   
    						pFrameYUV->linesize[2]=bmp->pitches[1];
    						sws_scale(img_convert_ctx, (const unsigned char* const*)pFrame->data, pFrame->linesize, 0, pCodecCtx->height, pFrameYUV->data, pFrameYUV->linesize);
    
    #if OUTPUT_YUV420P  
    						int y_size=pCodecCtx->width*pCodecCtx->height;    
    						fwrite(pFrameYUV->data[0],1,y_size,fp_yuv);    //Y   
    						fwrite(pFrameYUV->data[1],1,y_size/4,fp_yuv);  //U  
    						fwrite(pFrameYUV->data[2],1,y_size/4,fp_yuv);  //V  
    #endif  
    						SDL_UnlockYUVOverlay(bmp); 
    						
    						SDL_DisplayYUVOverlay(bmp, &rect); 
    
    					}
    				}
    				av_free_packet(packet);
    			}else{
    				//Exit Thread
    				thread_exit=1;
    			}
    		}else if(event.type==SDL_QUIT){
    			thread_exit=1;
    		}else if(event.type==SFM_BREAK_EVENT){
    			break;
    		}
    
    	}
    
    
    	sws_freeContext(img_convert_ctx);
    
    #if OUTPUT_YUV420P 
        fclose(fp_yuv);
    #endif 
    
    	SDL_Quit();
    
    	//av_free(out_buffer);
    	av_free(pFrameYUV);
    	avcodec_close(pCodecCtx);
    	avformat_close_input(&pFormatCtx);
    
    	return 0;
    }
    





    结果

    程序的运行效果如下。这个运行结果还是十分有趣的,会出现一个屏幕“嵌套”在另一个屏幕里面的现象,环环相套。
     
    可以通过代码定义的宏来确定是否将解码后的YUV420P数据输出成文件:
    #define OUTPUT_YUV420P 0

    可以通过下面的宏定义来确定使用GDIGrab或者是Dshow打开摄像头:

    //'1' Use Dshow 
    //'0' Use GDIgrab
    #define USE_DSHOW 0


    下载


    Simplest FFmpeg Device 


    项目主页

    SourceForge:https://sourceforge.net/projects/simplestffmpegdevice/

    Github:https://github.com/leixiaohua1020/simplest_ffmpeg_device

    开源中国:http://git.oschina.net/leixiaohua1020/simplest_ffmpeg_device


    CSDN下载地址:
    http://download.csdn.net/detail/leixiaohua1020/7994049

    注:
     本工程包含两个基于FFmpeg的libavdevice的例子:
     simplest_ffmpeg_grabdesktop:屏幕录制。
     simplest_ffmpeg_readcamera:读取摄像头


    更新-1.1(2015.1.9)=========================================

    该版本中,修改了SDL的显示方式,弹出的窗口可以移动了。

    CSDN下载地址:http://download.csdn.net/detail/leixiaohua1020/8344695


    更新-1.2 (2015.2.13)=========================================

    这次考虑到了跨平台的要求,调整了源代码。经过这次调整之后,源代码可以在以下平台编译通过:

    VC++:打开sln文件即可编译,无需配置。

    cl.exe:打开compile_cl.bat即可命令行下使用cl.exe进行编译,注意可能需要按照VC的安装路径调整脚本里面的参数。编译命令如下。

    ::VS2010 Environment
    call "D:\Program Files\Microsoft Visual Studio 10.0\VC\vcvarsall.bat"
    ::include
    @set INCLUDE=include;%INCLUDE%
    ::lib
    @set LIB=lib;%LIB%
    ::compile and link
    cl simplest_ffmpeg_grabdesktop.cpp /MD /link SDL.lib SDLmain.lib avcodec.lib ^
    avformat.lib avutil.lib avdevice.lib avfilter.lib postproc.lib swresample.lib swscale.lib ^
    /SUBSYSTEM:WINDOWS /OPT:NOREF

    MinGW:MinGW命令行下运行compile_mingw.sh即可使用MinGW的g++进行编译。编译命令如下。

    g++ simplest_ffmpeg_grabdesktop.cpp -g -o simplest_ffmpeg_grabdesktop.exe \
    -I /usr/local/include -L /usr/local/lib \
    -lmingw32 -lSDLmain -lSDL -lavformat -lavcodec -lavutil -lavdevice -lswscale

    GCC(Linux):Linux命令行下运行compile_gcc.sh即可使用GCC进行编译。编译命令如下。

    gcc simplest_ffmpeg_grabdesktop.cpp -g -o simplest_ffmpeg_grabdesktop.out \
    -I /usr/local/include -L /usr/local/lib -lSDLmain -lSDL -lavformat -lavcodec -lavutil -lavdevice -lswscale

    GCC(MacOS):MacOS命令行下运行compile_gcc_mac.sh即可使用GCC进行编译。Mac的GCC和Linux的GCC差别不大,但是使用SDL1.2的时候,必须加上“-framework Cocoa”参数,否则编译无法通过。编译命令如下。

    gcc simplest_ffmpeg_grabdesktop.cpp -g -o simplest_ffmpeg_grabdesktop.out \
    -framework Cocoa -I /usr/local/include -L /usr/local/lib -lSDLmain -lSDL -lavformat -lavcodec -lavutil -lavdevice -lswscale

    PS:相关的编译命令已经保存到了工程文件夹中


    CSDN下载地址:http://download.csdn.net/detail/leixiaohua1020/8445747

    SourceForge上已经更新。


    展开全文
  • vue项目做屏幕自适应处理

    万次阅读 2019-03-12 13:22:46
    项目基于vue-cli搭建,之前项目采用less的功能函数集合媒体查询做的屏幕适配,但是由于JavaScript的对浮点数据处理,这个语言本身的bug问题,总是会出现一些计算误差,这里重新做的项目采用淘宝的lib-flexible的库,来做...

    起由

    项目基于vue-cli搭建,之前项目采用less的功能函数集合媒体查询做的屏幕适配,但是由于JavaScript的对浮点数据处理,这个语言本身的bug问题,总是会出现一些计算误差,这里重新做的项目采用淘宝的lib-flexible的库,来做屏幕自适应处理.
    vue-cli搭建完成以后,安装完依赖,项目可以运行以后,我们接着安装felxible库:

      npm i lib-flexible -S
    

    npm安装不上去的,可以切换到cnpm上来安装,然后在主文件main.js里面引入:

      import  'lib-flexible'
    

    在index.html文件中设置meta标签:

      <meta name='viewport' content='width=device-width , initial-scale=1.0'>
    

    然后在项目中写css时会自动将rem转化为px,需要安装px2rem这个工具,安装:

      npm i px2rem-loader -D
    

    在until.js配置文件对loader做相关配置:

    在cssLoader对象下面添加一个px2remLoader对象:

      const px2remLoader = {
        loader : 'px2rem-loader',
        options : {
          //这个参数是通过psd设计稿的  宽度 / 10 来计算,这里以750为标准
          remUnit : 75  
        }
      }
    

    然后将utils.js文件中的generateLoaders函数的loaders常量改为[cssLoader, px2remLoader]

      const loaders = [cssLoader, px2remLoader];
    

    这样就做完了所以配置,当你做开发时,只需要将设计稿上面量到的尺寸写出来就可以了,比如font-size:18px;就直接写18px就可以


    -------------------------------
    作者:有风吹是幸福的
    链接:https://www.jianshu.com/p/02c1d9a63dc8
    来源:简书
    简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

    展开全文
  • 然鹅,打开PS CS6 我就懵逼了啊 这屏幕 这叫一个小 这是给人看的吗!! 简直反人类 于是百度了 各种方法 有国外大神说可以改注册表什么的  在这里安利一下最简单的方法  右键不合适分辨率的老版...

    自从买了4K屏电脑啊,简直像是去眼镜店配了新眼镜似的,看东西贼清晰,贼喜欢hhhhhh


    然鹅,打开PS CS6 我就懵逼了啊  这屏幕 这叫一个小 这是给人看的吗!! 简直反人类


    于是百度了 各种方法 有国外大神说可以改注册表什么的 


    在这里安利一下最简单的方法 


    右键不合适分辨率的老版软件 》 属性 》 兼容性 》



    这图片真是贼大 把应用程序改成系统就好了  要是还不好改成系统(增强) 但是我的增强改了有BUG


    重启软件就好了喵~


    就是分辨率有点问题 啊 好使就好啦 要啥自行车!

    展开全文
  • H5移动端页面自适应普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的,但是各设备对该标签的解释方式及支持程度不同造成了不能兼容所有浏览器或系统。   viewport 是用户网页的可视区域。翻译为...

    1、使用meta标签:viewport

    H5移动端页面自适应普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的,但是各设备对该标签的解释方式及支持程度不同造成了不能兼容所有浏览器或系统。

     

    viewport 是用户网页的可视区域。翻译为中文可以叫做"视区"。

    手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中(这样会破坏没有针对手机浏览器优化的网页的布局),用户可以通过平移和缩放来看网页的不同部分。

     

    viewport标签极其属性:

    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

    每个属性的详细介绍:

    属性名 取值 描述
    width 正整数 或 device-width 定义视口的宽度,单位为像素
    height 正整数 或 device-height 定义视口的高度,单位为像素,一般不用
    initial-scale [0.0-10.0] 定义初始缩放值
    minimum-scale [0.0-10.0] 定义缩小最小比例,它必须小于或等于maximum-scale设置
    maximum-scale [0.0-10.0] 定义放大最大比例,它必须大于或等于minimum-scale设置
    user-scalable yes/no 定义是否允许用户手动缩放页面,默认值yes

     

     

     

     

     

     

     

    2、使用css3单位rem

    rem是CSS3新增的一个相对单位(root em,根em),使用rem为元素设定字体大小时,是相对大小,但相对的只是HTML根元素。通过它既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应。

    目前,除了IE8及更早版本外,所有浏览器均已支持rem。对于不支持它的浏览器多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小。下面就是一个例子:

    p {font-size:14px; font-size:.875rem;}

     

    默认html的font-size是16px,即1rem=16px,如果某div宽度为32px你可以设为2rem。

    通常情况下,为了便于计算数值则使用62.5%,即默认的10px作为基数。当然这个基数可以为任何数值,视具体情况而定。设置方法如下:

    Html{font-size:62.5%(10/16*100%)}

     

    具体不同屏幕下的规则定义,即基数的定义方式:可以通过CSS定义,不同宽度范围里定义不同的基数值,当然也可以通过js一次定义方法如下:

    复制代码

    <script type="text/javascript">
       (function (doc, win) {
          var docEl = doc.documentElement,
            resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
            recalc = function () {
              var clientWidth = docEl.clientWidth;
              if (!clientWidth) return;
              docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';//其中“20”根据你设置的html的font-size属性值做适当的变化
            };
    
          if (!doc.addEventListener) return;
          win.addEventListener(resizeEvt, recalc, false);
          doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window);
    </script>
    
    

    复制代码

     

    3、使用媒体查询

    媒体查询也是css3的方法,我们要解决的问题是适应手机屏幕,这个媒体查询正是为解决这个问题而生。

    媒体查询的功能就是为不同的媒体设置不同的css样式,这里的“媒体”包括页面尺寸,设备屏幕尺寸等。

    例如:如果浏览器窗口小于 500px, 背景将变为浅蓝色:

    @media only screen and (max-width: 500px) {
        body {
            background-color: lightblue;
        }
    }

     

    4、使用百分比

    百分比指的是父元素,所有百分比都是这样的。子元素宽度50%,那么父元素的宽度就是100%;

    所以body默认宽度是屏幕宽度(PC中指的是浏览器宽度)子孙元素按百分比定位(或指定尺寸)就可以了,这只适合布局简单的页面,复杂的页面实现很困难。

    转载请注明出处:

    http://www.cnblogs.com/wenzheshen/

    http://zypj01.b2b.qieta.com/

    展开全文
  • 【自动化】获取手机的屏幕状态

    千次阅读 2018-05-23 18:57:59
    可能在Android测试过程中有很多需要获取的元素,比如这个手机的屏幕状态,除了可以用开发APK API(Java)实现获取锁屏状态外也可以通过adb命令获取手机是否锁屏状态,当然这种使用的adb的方式可以用python来封装。...
  • 安卓屏幕驱动移植

    千次阅读 2016-10-27 23:11:30
    点亮一个新屏幕,下面以8909-x26的屏幕为例。   启动引导部分: 一、添加对应的.h文件  首先添加一个.h头文件,命名为panel_ili9806e_fwvga_hsd_helitai_x26_video.h,该文件放在路径/bootable/bootloader/lk/...
  • 前文提到过,在虚拟硬件配置中使用绝对定位设备(tablet)取代相对定位设备(mouse)是解决 QEMU VNC 访问 Xen 虚拟机时“双鼠标指针”问题的办法之一。这种办法对于 Windows 和 Ubuntu 虚拟机都有效,无需在虚拟机...
  • 反转颜色了,连按三次主屏幕就可以了。
  • 问题:手指按住不动时,屏幕也会上下抖动 解决:拔掉电源!充电的时候才会这样!我郁闷了好几次了!SHIT!
  • 共享屏幕,录屏的方法

    万次阅读 2019-09-03 21:44:24
    不管是录制屏幕还是共享屏幕首先要有chrome浏览器。 请自行在百度搜索下载。 录制屏幕的方法: 安装拓展工具: 安装地址:https://chrome.google.com/webstore/detail/recordrtc/ndcljioonkecdnaaihodjgiliohngojp ...
  • unity 屏幕坐标&世界坐标相互转换

    万次阅读 2018-02-11 21:04:53
    世界坐标转屏幕坐标:Vector3 screenPos = Camera.main.WorldToScreenPoint(pos); 屏幕坐标转世界坐标:Vector3 worldPos = Camera.main.ScreenToWorldPoint(pos);
  • 调整虚拟机屏幕大小(全屏)

    万次阅读 2018-03-03 18:23:35
    首先解决一个问题:配置虚拟机,发现屏幕大小太小 需要安装vmware tools ,屏幕就会自适应 但是安装vmware tools 的按钮是灰的,所以我首先就是安装它 ...
  • Android屏幕旋转的生命周期

    万次阅读 2019-03-28 07:04:33
    首先,当屏幕方向发生变化的时候,其所显示的Activity会发生生命周期的变化: 依次调用onPause、onStop、onDestroy、onCreate、onResume。因此在屏幕旋转的时候会销毁当前Activity。 那么怎么才能android系统不去...
  • 由于一些原因,比如进行远程电脑时屏幕大小不同,导致一些程序窗口超出屏幕拉不出来或移到屏幕边上,以下附上解决方法。 方法/步骤 0.碰到情况基本如下所示。 或者完全在页面上没有显示 1.首先按alt...
  • ABAP 屏幕开发 - 子屏幕调用

    万次阅读 2020-02-20 19:55:09
    事务代码SE80. 主屏幕:100 子屏幕:200 子屏幕:300 主屏幕100调用子屏幕200和300
  • Android中获得屏幕宽高的实用方法

    万次阅读 2017-09-10 11:03:26
    获得屏幕的宽度和高度有很多种方法 //1、通过WindowManager获取 DisplayMetrics dm = new DisplayMetrics(); heigth = dm.heightPixels; width = dm.widthPixels;//2、通过Resources获取 DisplayMetrics dm = ...
  • Android获取屏幕的宽度和高度(dp)

    万次阅读 2014-03-29 17:09:22
    一般我们需要的宽度和高度都是需要dp格式,但是在网上找了一大堆的资料基本上得到的宽度和高度都是像素(Pixels)型的宽度和高度,与我们所需要的不一样,后面经过查找资料终于找到解决办法,下面上代码,老鸟勿喷 ...
  • android获取屏幕的物理尺寸

    万次阅读 2017-08-23 17:52:30
    * @ 获取当前手机屏幕尺寸 */ public static float getPingMuSize(Context mContext) { int densityDpi = mContext.getResources().getDisplayMetrics().densityDpi; float scaledDensity = mContext.getResou
  • CocosCreator_获取屏幕尺寸

    万次阅读 2018-08-04 00:13:33
    let windowSize=cc.view.getVisibleSize(); cc.log("width="+windowSize.width+",height="+windowSize.height);; windowSize=cc.winSize;//推荐 原因 短 ...+windowSize.heigh...
  • Android手机之间实现屏幕共享

    万次阅读 热门讨论 2019-04-28 13:02:36
    已经实现,优化空间还很大。 效果Gif ...方法二:用录屏API录制手机屏幕,上传至服务器。 Demo用方法一实现的,可以看GIF,我觉得可以优化的空间: 1,截图:截图时找到合适的频率,能不能优化一下...
1 2 3 4 5 ... 20
收藏数 1,194,341
精华内容 477,736
关键字:

屏幕