@charset "utf-8";

/* CSS Document */
html,
body,
ul,
li,
ol,
dl,
dd,
dt,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
legend,
img {
margin:;
padding:;
} fieldset,
c {
border: none;
} img {
display: block;
} address,
caption,
cite,
code,
dfn,
th,
var {
font-style: normal;
font-weight: normal;
} ul,
ol,
li {
list-style: none;
} body {
color: #333;
font: 12px Arial,"Microsoft Yahei",sans-serif;
background: #fff;
} a {
color: #fff;
text-decoration: none;
} /*清除浮动*/
.clear {
clear: both
} * {
box-sizing: border-box
} .border-1px::after {
content: '';
position: absolute;
top:;
left:;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 200%;
height: 200%;
-webkit-transform: scale(0.5);
transform: scale(0.5);
-webkit-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
} body,
html,
#app {
height: 100%;
background: #f5f5f5;
} @media (min-width: 240px) {
html {
font-size: 32px;
}
} @media (min-width: 320px) {
html {
font-size: 42.66667px;
}
} @media (min-width: 360px) {
html {
font-size: 48px;
}
} @media (min-width: 375px) {
html {
font-size: 50px;
}
} @media (min-width: 384px) {
html {
font-size: 51.2px;
}
} @media (min-width: 411px) {
html {
font-size: 54.8px;
}
} @media (min-width: 414px) {
html {
font-size: 55.2px;
}
} @media (min-width: 424px) {
html {
font-size: 56.53333px;
}
} @media (min-width: 480px) {
html {
font-size: 64px;
}
} @media (min-width: 540px) {
html {
font-size: 72px;
}
} @media (min-width: 640px) {
html {
font-size: 85.33333px;
}
} @media (min-width: 720px) {
html {
font-size: 96px;
}
} @media (min-width: 750px) {
html {
font-size: 100px;
}
} @media (min-width: 768px) {
html {
font-size: 102.4px;
}
} @media (min-width: 800px) {
html {
font-size: 106.66667px;
}
} @media (min-width: 980px) {
html {
font-size: 130.66667px;
}
} @media (min-width: 1024px) {
html {
font-size: 136.53333px;
}
} @media (min-width: 1080px) {
html {
font-size: 144px;
}
} @media (min-width: 1152px) {
html {
font-size: 153.6px;
}
} @media (min-width: 1366px) {
html {
font-size: 182.13333px;
}
} @media (min-width: 1440px) {
html {
font-size: 192px;
}
} @media (min-width: 2160px) {
html {
font-size: 288px;
}
}

前端自适应样式reset.css的更多相关文章

  1. 前端自适应样式(reset.css)

    @charset "utf-8"; /* CSS Document */ html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4 ...

  2. 移动端(处理边距样式)reset.css

    移动端reset.css,来自张鑫旭网站的推荐,下载地址:https://huruqing.gitee.io/demos/source/reset.css 代码 /* html5doctor.com ...

  3. 页面重置样式reset.css

    我把经常用到的一些页面重置样式归类到了一个.css文件中,这样可以减少代码冗余.当然还有其他的很多用处,比如h1~h5的样式全部统一的话,下面写东西很清晰很多. @charset 'utf-8'; h ...

  4. 关于reset.css的疑问:为什么一定要重置浏览器样式?

    自开始做前端算起,我所做过的每一个项目中都会有一个reset.css,也就是重置样式表.我现在想想都不知道第一次是从哪儿弄来的一个重置样式表.快五年了,好像从来都没有质疑过关于重置样式表的内容. 这样 ...

  5. reset.css css重置公共样式

    @charset "utf-8";/*Css Document*/ /*! * @名称:reset.css * @功能:1.重设浏览器默认样式 * 2.设置通用原子类 *//* 防 ...

  6. Web前端开发如何利用css样式来控制Html中的h1/h2/h3标签不换行

      H1/H2/H3/H4标题标签常常使用在一个网页中唯一标题.重要栏目.重要标题等情形下. H1在一个网页中最好只使用一次,如对一个网页唯一标题使用.H2.H3.H4标签则可以在一个网页中多次出现, ...

  7. reset.css(样式重置)

    CSS Reset,意为重置默认样式.HTML中绝大部分标签元素在网页显示中都有一个默认属性值,通常为了避免重复定义元素样式,需要进行重置默认样式(CSS Reset).举几个例子:1.淘宝(CSS ...

  8. Reset.css和Normalize.css样式表初始化相关

    (1)Reset.css 简介:在HTML标签在浏览器里有默认的样式,例如 p 标签有上下边距,strong标签有字体加粗样式,em标签有字体倾斜样式.不同浏览器的默认样式之间也会有差别,例如ul默认 ...

  9. 封装好通用的reset.css base.css 样式重置css文件

    一般是叫reset.css 我这边命名成base.css 哎呀无所谓…… @charset "UTF-8"; /*css reset*/ /*清除内外边距*/ body, h1, ...

随机推荐

  1. css定位有哪几种方式

    一.position 属性规定元素的定位类型,它一般有以下四个值: 默认static 相对定位relative 绝对定位absolute 固定定位fixed 元素可以使用的顶部,底部,左侧和右侧属性定 ...

  2. AJ学IOS 之二维码学习,快速打开相机读取二维码

    AJ分享,必须精品 上一篇文章写了怎么生成二维码,这儿就说说怎么读取吧,反正也很简单,iOS封装的太强大了 步骤呢就是这样: 读取二维码需要导入AVFoundation框架#import <AV ...

  3. 【spring 国际化】springMVC、springboot国际化处理详解

    在web开发中我们常常会遇到国际化语言处理问题,那么如何来做到国际化呢? 你能get的知识点? 使用springgmvc与thymeleaf进行国际化处理. 使用springgmvc与jsp进行国际化 ...

  4. 挑战全网最幽默的Vuex系列教程:第二讲 Vuex旗下的State和Getter

    先说两句 上一讲 「Vuex 到底是个什么鬼」,已经完美诠释了 Vuex 的牛逼技能之所在(纯属自嗨).如果把 Vuex 比喻成农药里面的刘备,那就相当于你现在已经知道了刘备他是一个会打枪的力量型英雄 ...

  5. L12 Transformer

    Transformer 在之前的章节中,我们已经介绍了主流的神经网络架构如卷积神经网络(CNNs)和循环神经网络(RNNs).让我们进行一些回顾: CNNs 易于并行化,却不适合捕捉变长序列内的依赖关 ...

  6. 黑猫关键词URL采集工具 Pro v1.0

    功能介绍:黑猫关键词URL采集工具 Pro v1.0 批量关键词自动搜索采集 自动去除垃圾二级泛解析域名 可设置是否保存域名或者url 联系客服QQ:944520563

  7. 手机app测试用例怎么写?手机app测试点有哪些?只有干货没有水分,错过绝对后悔!

    一.前言    在当今竞争激烈的市场上一个APP的成功离不开一个可靠的测试工程师.因此,对功能和用户体验有特殊关注的App进行全面测试是必不可少的.如何做到测试用例的百分百覆盖一直是测试用例编写过程中 ...

  8. 高质量动漫实时画质增强器Anime4K在mpv上的配置

    Anime4K地址 https://github.com/bloc97/Anime4K mpv地址  https://mpv.io/   这个要错峰下载,网速不太好 在C盘用户\..\AppData\ ...

  9. js拼接php拼接

    当我们用到ajax的时候,局部替换的时候,我们可以在前台拼接,后台拼接,这个取决于你是前端后端这样拼接判断比较好, 判断不拼接,判断的值进行拼接  然后在html  替换 $.each 前台循环    ...

  10. Django ORM 查询表中某列字段值

    场景: 有一个表中的某一列,你需要获取到这一列的所有值,你怎么操作? 解决办法: 有一个model为:Event 方式一: 获取内容: Event.objects.values('title') 输出 ...