前端自适应样式reset.css
@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的更多相关文章
- 前端自适应样式(reset.css)
@charset "utf-8"; /* CSS Document */ html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4 ...
- 移动端(处理边距样式)reset.css
移动端reset.css,来自张鑫旭网站的推荐,下载地址:https://huruqing.gitee.io/demos/source/reset.css 代码 /* html5doctor.com ...
- 页面重置样式reset.css
我把经常用到的一些页面重置样式归类到了一个.css文件中,这样可以减少代码冗余.当然还有其他的很多用处,比如h1~h5的样式全部统一的话,下面写东西很清晰很多. @charset 'utf-8'; h ...
- 关于reset.css的疑问:为什么一定要重置浏览器样式?
自开始做前端算起,我所做过的每一个项目中都会有一个reset.css,也就是重置样式表.我现在想想都不知道第一次是从哪儿弄来的一个重置样式表.快五年了,好像从来都没有质疑过关于重置样式表的内容. 这样 ...
- reset.css css重置公共样式
@charset "utf-8";/*Css Document*/ /*! * @名称:reset.css * @功能:1.重设浏览器默认样式 * 2.设置通用原子类 *//* 防 ...
- Web前端开发如何利用css样式来控制Html中的h1/h2/h3标签不换行
H1/H2/H3/H4标题标签常常使用在一个网页中唯一标题.重要栏目.重要标题等情形下. H1在一个网页中最好只使用一次,如对一个网页唯一标题使用.H2.H3.H4标签则可以在一个网页中多次出现, ...
- reset.css(样式重置)
CSS Reset,意为重置默认样式.HTML中绝大部分标签元素在网页显示中都有一个默认属性值,通常为了避免重复定义元素样式,需要进行重置默认样式(CSS Reset).举几个例子:1.淘宝(CSS ...
- Reset.css和Normalize.css样式表初始化相关
(1)Reset.css 简介:在HTML标签在浏览器里有默认的样式,例如 p 标签有上下边距,strong标签有字体加粗样式,em标签有字体倾斜样式.不同浏览器的默认样式之间也会有差别,例如ul默认 ...
- 封装好通用的reset.css base.css 样式重置css文件
一般是叫reset.css 我这边命名成base.css 哎呀无所谓…… @charset "UTF-8"; /*css reset*/ /*清除内外边距*/ body, h1, ...
随机推荐
- 利用opencv实现视频捕捉功能
import cv2 as cv import numpy as np def video_demo(): capture = cv.VideoCapture(0) #打开摄像头,参数0代表设备ID( ...
- 定位new表达式与显式调用析构函数
C++的核心理念之一是RAII,Resource Acquisition Is Initialization,资源获取即初始化.资源有很多种,内存.互斥锁.文件.套接字等:RAII可以用来实现一种与作 ...
- [PHP] 调用微博API 发微博OAuth2.0
在实际测试中出现很多问题, 第一就是按照文档调用ACCESS_TOKEN的时候费老劲啦,因为是编辑线上的,有好多中文空格,没有看出来!整了好久! 第二个就是在调用api发微博的时候出现乱码!必须把发送 ...
- shiro:加密及密码比对器(三)
基于[自定义remle(二)]项目增加加密功能 1:数据库t_user表增加一列(盐) 增加字段:salt CREATE TABLE `t_user` ( `id` int(11) NOT NULL ...
- Redis开发运维的陷阱及避坑指南
原文首发于博客园,作者:后青春期的Keats:地址:https://www.cnblogs.com/keatsCoder/ 转载请注明,谢谢! Linux 配置优化 我们在使用 Redis 过程中,可 ...
- SeleniumHQ
下载地址:http://www.seleniumhq.org/download/
- Centos 7服务器搭建MySQL(mariadb)服务
1.下载并安装MySQL yum install mariadb mariadb-server -y 2.启动MySQL systemctl start mariadb 3.对mariadb进行初始化 ...
- JVM 真的很难学么?不、只是你“不敢学”而已
JVM 真的很难学么?不.只是你"不敢学"而已 许多招聘的信息上面都说,要了解jvm.多线程什么的对于 java 程序员来说,这是工作好多年的程序员都不一定能掌握的东 ...
- 网络找的 关于 “中吹” Janus Dongye
看了这篇文章,感觉错过了一个精彩的人生. Janus Dongye, Coding Peasant at Universityof Cambridge (2012-present)(剑桥码农,2012 ...
- python学习18类4之静态类
'''''''''类的静态方法.普通方法.类方法 静态方法: 用 @staticmethod 装饰的不带 self 参数的方法叫做静态方法,类的静态方法可以没有参数,可以直接使用类名调用. 普通方法: ...