如何根据分辨率调用不同的css文件
发布网友
发布时间:2022-04-21 05:25
我来回答
共2个回答
热心网友
时间:2022-04-21 06:54
css具有媒体响应功能,可以判断屏幕宽度,从而加载设置的css
如下代码,当宽度小于1000px的时候加载css下的css-mobile.css
<link href="css/css-mobile.css" rel="stylesheet" type="text/css" media="screen and (max-width: 1000px)">
如下代码,当宽度大于1000px的时候加载css下的css-pc.css
<link href="css/css-pc.css" rel="stylesheet" type="text/css" media="screen and (min-width: 1000px)">
热心网友
时间:2022-04-21 08:12
可以判断当前屏幕分辨率,然后再给予对应的css文件路径,如:
html:
<link rel="stylesheet" type="text/css" id="css">
js:
window.onload = function(){
if((screen.width == 1024) && (screen.height == 768)){
document.getElementById('css').href = '1.css';
}else if ((screen.width == 800) && (screen.height == 600)){
document.getElementById('css').href = '2.css' ;
}else{
document.getElementById('css').href = '3.css';
}
}
screen.width是当前屏幕分辨率的宽度,screen.height是当前屏幕分辨率的高度
怎么让浏览器根据不同分辨率加载不同的js文件或者函数,类似于css的@...
可以判断当前屏幕分辨率,然后再给予对应的css文件路径,如:html: js:window.onload = function(){ if((screen.width == 1024) && (screen.height == 768)){ document.getElementById('css').href = '1.css';}else if ((screen.width == 800) && (screen.height == 600)){ document....
PC端页面适应不同的分辨率的方法
1.根据不同的分辨率,引入不同的css样式表 这个方法和方法一相同,也是通过判断电脑的分辨率,来引入相对应的css样式表。2.在同一个css样式表中,根据不同的分辨率,写不同的css样式 这个方法只有一个css演示表,在这个样式表里面,根据不同的分辨率,写不同的css样式。
JAVA根据显示器分辨率来调用不同的css样式表
而只须用css定义表格宽度为100%:width:100%,同样,在asp网页中,也把表格宽度一律采用百分比,设置成width=100%,字体统一设置为9-12px,不要设成14px。这样的话,你的网页将神奇般地根据多种分辨率展现在网虫面前。参考资料:http://www.58wk.com/showpost.asp?ThreadID=3628 ...
如何让HTML页面根据分辨率自动选取样式?
function ScreenWidth(CSS1,CSS2,CSS3,CSS4){ if ((screen.width == 1024) && (screen.height == 768)){ setActiveStyleSheet(CSS1);}else{ if ((screen.width == 800) && (screen.height == 600)){ setActiveStyleSheet(CSS2);}else{ if ((screen.width == 1152) && (screen.height ...
手机屏幕自适应 不同屏幕宽度加载不同的css
首先手机的分辨率,和实际网页宽度是不一样的。不信你可以写个js弹出当时的屏幕宽度。然后,你在head里加试试。如果成功,希望你搜一下这个的作用,可以帮助你以后更好的写手机页面。
怎样在CSS里根据显示器分辨率调整大小以px为单位的图片宽度?
你说的这个叫媒体查询,是CSS3里面的概念。通过媒体查询,可以根据不同的屏幕分辨率使用不同的显示策略。媒体查询的使用方式如下:media (min-width:800px) and (max-width:1200px) { ... }即:屏幕分辨率大于800,小于1200的使用这个策略。这样就可以根据不同的屏幕分辨率在css样式里设置图片的宽度了...
...768px的时候和320px的时候分别加载不同的CSS文件。
media (min-width: 768px){ //>=768的设备 } media (min-width: 992px){ //>=992的设备 } media (min-width: 1200){ //>=1200的设备 } 在{}里面写CSS 根据你的需求更改分辨率
PC端页面适应不同的分辨率的方法
这个方法的思路是,分别针对800、1280、1440、1600、1920等分辨率,创建不同的css文件。然后在各种分辨率下,写css样式表。可能你会感觉针对一个页面,要写这么多不同的css样式表,这个工作量肯定很大。其实也不尽然,根据我在这个项目中的实践,发现这个工作量其实是比较小的。首先,我们在做项目的时候,...
网页CSS怎么解决分辨率不一样的问题?
两种方式,一种是直接在link中判断设备的尺寸,然后引用不同的css文件: 意思是当屏幕的宽度大于等于400px的时候,应用styleA.css 意思是当屏幕的宽度大于600小于800时,应用styleB.css 另一种方式,即是直接写在标签里:media screen and (max-width: 600px) { /*当屏幕尺寸小于600px时,应用下面...
mouse_event如何适应不同分辨率
根据查询简书官网显示。1、根据不同的分辨率,引入不同的css样式表。2、在同一个css样式表中,根据不同的分辨率,写不同的css样式。