PC端样式重置

html{font-family:"Microsoft YaHei UI","Microsoft YaHei",sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
html,body,div,object,iframe,applet,object,h1,h2,h3,h4,h5,h6,p,blockquote,pre,address,dl,dt,dd,ol,ul,li,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,menu,nav,output,ruby,section,summary,time,mark,audio,video,progress{margin:0;padding:0;border:0;vertical-align:baseline}
li{list-style:none}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block}
audio:not([controls]){display:none;height:0}
[hidden],template{display:none}
a{background-color:transparent;text-decoration:none}
a:active,a:hover{outline:0}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
dfn{font-style:italic}
h1{font-size:2em;margin:.67em 0}
mark{background:#ff0;color:#000}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:1em 40px}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}
pre{overflow:auto}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;outline:none;line-height:normal}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}
legend{border:0;padding:0}
textarea{overflow:auto}
optgroup{font-weight:bold}
table{border-collapse:collapse;border-spacing:0}
td,th{padding:0}
时间: 2024-11-20 22:11:48

PC端样式重置的相关文章

响应式学习7-自己写PC端样式

写好html后,其实就是一堆文字而已,还是要靠css去弄. 全都用rem,100%即可. 加上不可缩放,基本就能响应式了 如果网页里有图片,那么如果页面宽度比图片笑小了,那么就会有滑动条了 这个也是没法的 flex布局,相当于让里面的元素浮动了! 再让列表作为flex 父元素 还是有高度的 用margin什么的就好了 没什么难度 只要不是宽度太窄,都能够响应 下面也一样 图片居中,要display = block才行 目前来说,ipad也可以,ipad和PC端一样,都是高分辨率的 先将广告那一栏

移动端样式重置(2)

html{font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%} html,body{-webkit-user-select:none;user-select:none;} html,body,div,object,iframe,applet,object,h1,h2,h3,h4,h5,h6,p,block

PC端和移动端网页的初始化样式

pc端样式重置 *{ margin:0; padding:0;} body{ font-size:14px; font-family:微软雅黑;font-style:normal;} a{ text-decoration:none} a,a:hover{  transition:background 0.5s linear;-webkit-transition:background 0.5s linear;-moz-transition:background 0.5s linear;-o-tra

目前公司用到的PC端和移动端的初始化样式

pc端样式重置 *{ margin:0; padding:0;} body{ font-size:14px; font-family:微软雅黑;font-style:normal;} a{ text-decoration:none} a,a:hover{  transition:background 0.5s linear;-webkit-transition:background 0.5s linear;-moz-transition:background 0.5s linear;-o-tra

移动端默认样式重置

1.outline:none (1)在pc端为a标签定义这个是为了取消ie浏览器下点击a标签时出现的虚线.ie7及以下浏览器还不识别此属性,需要在a标签上添加hidefocus="true" (2)input,textarea{outline:none}  取消chrome下默认的文本框聚焦样式 (3)在移动端是不起作用的,想要去除文本框的默认样式可以使用-webkit-appearance,聚焦时候默认样式的取消是-webkit-tap-highlight-color.看到一些移动端

移动端页面默认样式重置

1.-webkit-tap-highlight-color -webkit-tap-highlight-color:rgba(0,0,0,0);//透明度设置为0,去掉点击链接和文本框对象时默认的灰色半透明覆盖层(iOS)或者虚框(Android) -webkit-tap-highlight-color:rgba(255,0,0,0.5);   //利用此属性,设置touch时链接区域高亮为50%的透明红,只在ios上起作用.android上只要使用了此属性就表现为边框.在body上加此属性,这

js判断移动端与pc端

这里介绍下使用device.js插件来判断移动端设备 地址:https://github.com/matthewhudson/device.js 示例: if(device.mobile()){ window.location.href = "移动端地址"; //alert("移动端"); } else { window.location.href = "PC端地址"; //alert("PC端"); } 更多设备判断如下表格

第31章 项目实战-PC端固定布局[1]

学习要点: 1.准备工作 2.创建项目 3.网站结构 4.CSS选择器 5.完成导航 主讲教师:李炎恢 本章主要开始使用学习用HTML5和CSS3来构建Web页面,第一个项目采用PC端 固定布局来实现. 一.准备工作 1.为了达到最低效果,第一个项目将采用1440x900的分辨率录制:因为,1024根本无法容纳最低宽度的页面:页面采用1280的最低宽度设计,去掉滚动条为1263像素. 2.第一个项目是PC端的固定布局,会采用像素(px)单位. 3.项目素材图片,是课外独立设计好的,课程不会去设计

图片压缩(pc端和移动端都适用)

最近在做移动端遇到了一个问题就是: 手机拍照后,图片过大如果上传到服务器务必会浪费带宽,最重要的是流量啊 别慌,好事儿来了,务必就会有人去研究研究图片的压缩: 鄙人结合前人的经验,结合自己实战,总结出一个方法供大家参考. /** * 图片压缩,默认同比例压缩 * @param {Object} path * pc端传入的路径可以为相对路径,但是在移动端上必须传入的路径是照相图片储存的绝对路径 * @param {Object} obj * obj 对象 有 width, height, qual