精华内容
下载资源
问答
  • css样式重置

    2018-01-12 16:40:02
    css样式重置,将css默认的样式进行清除,这样有助于自己写自己的css
  • CSS样式重置

    2017-09-23 10:08:47
    CSS样式重置pc端/* reset */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0} /* 初始化标签在所有...

    pc端

    /* reset */  
    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0}  /* 初始化标签在所有浏览器中的margin、padding值 */  
    fieldset,img {border:0 none}  /* 重置fieldset(表单分组)、图片的边框为0*/  
    dl,ul,ol,menu,li {list-style:none}   /* 重置类表前导符号为onne,menu在HTML5中有效 */  
    blockquote, q {quotes: none}   /* 重置嵌套引用的引号类型 */  
    blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}  /* 重置嵌套引用*/  
    input,select,textarea,button {vertical-align:middle}  /* 重置表单控件垂直居中*/  
    button {border:0 none;background-color:transparent;cursor:pointer}  /* 重置表单button按钮效果 */  
    body {background:#fff}   /* 重置body 页面背景为白色 */  
    body,th,td,input,select,textarea,button {font-size:12px;line-height:1 ;font-family:"微软雅黑", "黑体","宋体";color:#666} /* 重置页面文字属性 */  
    a {color:#666;text-decoration:none}  /* 重置链接a标签 */  
    a:active, a:hover {text-decoration:none}   /* 重置链接a标签的鼠标滑动效果 */  
    address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}  /* 重置样式标签的样式 */  
    caption {display:none;}    /* 重置表格标题为隐藏 */  
    table {width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;}    /* 重置table属性 */  
    img{vertical-align:top}  /* 图片在当前行内的垂直位置 */  
    
    /* 页面设置 */  
    
      /* 取消a标签点击后的虚线框 */  
    a {outline: none;}    
    a:active {star:expression(this.onFocus=this.blur());}  
    
     /* 设置页面文字等在拖动鼠标选中情况下的背景色与文字颜色 */  
    /*   
    ::selection {color: #fff;background-color: #4C6E78;}      
    ::-moz-selection {color: #fff;background-color: #4C6E78;}   
    */  
    
    /*清除浮动*/  
    .clear{clear: both;}  
    
    /*清除浮动--推荐使用*/  
    .clearfix:before,.clearfix:after{content: '';display: table;}  
    .clearfix:after{clear: both;}  

    持续更新…

    手机端

    展开全文
  • css样式重置文件,去除默认样式。html标签存在一些默认样式,这些样式会影响我们设计网页。css样式重置文件,去除默认样式。html标签存在一些默认样式,这些样式会影响我们设计网页。css样式重置文件,去除默认样式...
  • CSS样式重置代码

    2020-09-25 03:10:28
    主要介绍了CSS样式重置代码,一般保存为reset.css修改了默认的css设置,方便布局与提高浏览器兼容性
  • CSS 样式重置

    2018-08-18 21:37:20
    常见网站的样式重置 新浪 html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; } fieldset, img { border:none; } img{display: block;} ...

    常见网站的样式重置

    新浪

    html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
    fieldset, img { border:none; }
    img{display: block;}
    address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; }
    ul, ol { list-style:none; }
    body { color:#333; font:12px/20px "SimSun","宋体","Arial Narrow",HELVETICA; background:#fff;/* overflow-y:scroll;*/ overflow-x:hidden;}
    a { color:#666; text-decoration:none; }
    a:visited { color:#666; }
    a:hover, a:active, a:focus { color:#ff8400; text-decoration:underline; }

    腾讯

    body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}
    body{font:12px "宋体","Arial Narrow",HELVETICA;background:#fff;}
    a{color:#172c45;text-decoration:none}
    a:hover{color:#cd0200;text-decoration:underline}
    em{font-style:normal}
    li{list-style:none}
    img{border:0;vertical-align:middle}
    table{border-collapse:collapse;border-spacing:0}
    p{word-wrap:break-word}
    .ind{text-indent:2em}
    .ind10{text-indent:10px;}
    .noborder{border:0;}

    搜狐

    body{font-family:"\5B8B\4F53","Arial Narrow",HELVETICA;text-align:center;margin:0 auto;padding:0;background:#FFF;font-size:12px;color:#333;}
    body > div{text-align:center;margin-right:auto;margin-left:auto;}
    div,form,ul,ol,li,span,p{margin:0;padding:0;border:0;}
    img,a img{border:0;margin:0;padding:0;}
    h1,h2,h3,h4,h5,h6{margin:0;padding:0;font-size:12px;font-weight:normal;}
    ul,ol,li{list-style:none}
    table,td,input{font-size:12px;padding:0} /* 默认链接颜色 */
    a{outline-style:none;color:#333;text-decoration:none}
    a:hover{color:#c00;text-decoration:underline;}
    展开全文
  • HTMLCSSHTML5CSS3css样式重置 移动端适配 css 默认样式重置1 @charset "utf-8";2 *{margin:0;padding:0;}3 img {border:none; display:block;}4 em,i{ font-style:normal;}5 body, div, dl, dt, dd, ul, ol, li, h1,...

    HTML

    CSS

    HTML5

    CSS3

    css样式重置 移动端适配

    CgpOIF5EAWWAQ0y_AAcB-fDz9P0878.png

    css  默认样式重置

    1 @charset "utf-8";2 *{margin:0;padding:0;}3 img {border:none; display:block;}4 em,i{ font-style:normal;}5 body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, font { padding: 0; margin: 0; font-family:"微软雅黑"; }6 table { border-collapse: collapse; border-spacing: 0;}7 h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; }8 ol, ul, li, dl, dt, dd { list-style: none; }9 input, button, textarea, checkbox, select, radio, form { vertical-align: top; }10 a{ color: #000; text-decoration: none; }11 a:link, a:visited { text-decoration: none; }12 a:hover{color:#cd0200;text-decoration:underline}13 input[type="submit"], input[type="reset"], input[type="button"], button {14 -webkit-appearance: none;15 }16 html,body{height:100%}

    移动端适配   rem.js

    /**

    * YDUI 可伸缩布局方案

    * rem计算方式:设计图尺寸px / 100 = 实际rem 例: 100px = 1rem

    */

    !function (window) {

    /* 设计图文档宽度 */

    var docWidth = 750;

    var doc = window.document,

    docEl = doc.documentElement,

    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';

    var recalc = (function refreshRem () {

    var clientWidth = docEl.getBoundingClientRect().width;

    /* 8.55:小于320px不再缩小,11.2:大于420px不再放大 */

    docEl.style.fontSize = Math.max(Math.min(20 * (clientWidth / docWidth), 11.2), 8.55) * 5 + 'px';

    return refreshRem;

    })();

    /* 添加倍屏标识,安卓为1 */

    docEl.setAttribute('data-dpr', window.navigator.appVersion.match(/iphone/gi) ? window.devicePixelRatio : 1);

    if (/iP(hone|od|ad)/.test(window.navigator.userAgent)) {

    /* 添加IOS标识 */

    doc.documentElement.classList.add('ios');

    /* IOS8以上给html添加hairline样式,以便特殊处理 */

    if (parseInt(window.navigator.appVersion.match(/OS (d+)_(d+)_?(d+)?/)[1], 10) >= 8)

    doc.documentElement.classList.add('hairline');

    }

    if (!doc.addEventListener) return;

    window.addEventListener(resizeEvt, recalc, false);

    doc.addEventListener('DOMContentLoaded', recalc, false);

    }(window);

    移动端适配静态小demo (需引入上方css、rem.js)

    css

    23d3ea184e21cb798fe4ea2c3886d7ff.gif

    6d9a05c69fe94a2813f2e1c0c1a9c302.gif

    1 body{2 display:flex;3 flex-direction:column;4 height:100%;5 }6

    7 /* head */8 header{9 height:1rem;10 background:#0dc441;11 display:flex;12 justify-content:center;13 align-items: center;14 }15 header span{16 display:block;17 width:1.5rem;18 height:.5rem;19 background:#64d985;20 text-align:center;21 line-height:.5rem;22 color:#fff;23 font-size:16px;24 }25 header span:nth-child(1){26 border-radius:1rem 0 0 1rem27 }28 header span:nth-child(2){29 border-radius: 0 1rem 1rem 0;30 background:#3dd067;31 color:#a3e9b7;32 }33

    34 /* nav */35 nav{36 height:1rem;37 border-bottom:1px solid #d9d9d9;38 display:flex;39 }40 nav li{41 height:1rem;42 flex:1;43 text-align:center;44 line-height:1rem;45 font-size:14px;46 color:#666;47 }48 nav .active{49 border-bottom:2px solid #0dc441;50 color:#0dc441;51 }52 .made{53 flex:1;54 overflow:auto;55 }56 article{57 display:flex;58 flex-wrap:wrap;59 justify-content:space-between;60 }61 article figure{62 width:49.2%;63 border:1px solid #e5e5e5;64 margin-bottom:0.42rem;65 }66 article figure img{67 width:100%;68 }69 /* footer */70 footer{71 height:1rem;72 background:pink;73 }

    View Code

    html

    23d3ea184e21cb798fe4ea2c3886d7ff.gif

    6d9a05c69fe94a2813f2e1c0c1a9c302.gif

    1

    2

    3

    4 孙行者

    5 者行孙

    6

    7

    8

    9

    孙悟空

    10 猪八戒

    11

    沙和尚

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    24

    25

    26

    27

    28

    29

    30

    31

    32

    33

    34

    35

    36

    37

    38

    39

    40

    41

    42

    43

    44

    45

    46

    47

    48

    49

    50

    51

    52

    53

    54

    55

    56

    57

    58

    59

    展开全文
  • 常用CSS样式重置

    千次阅读 2017-05-15 11:06:05
    常用CSS样式重置

    在写项目的时候,我们经常需要对有些常用的样式进行重置,很多人为了涂方便使用*{ margin: 0; padding: 0; };一般我都会引入一个自己写的样式重置的css文件;
    分享一下:

    /* 常用基本标签重设 */
    html,body{ height: 100%; }
    body{ font-size: 12px; color: #fff; }
    body,div,p,a,ul,li{ margin: 0; padding: 0; }  
    h1,h2,h3,h4,h4,h5,h6,h7{ margin: 0; padding: 0; }
    em{ font-style: normal; }
    a{ text-decoration: none; color: #000; }
    a:hover{ text-decoration: none; }
    img{ border: 0; vertical-align: middle; }
    li{ list-style: none; }
    label{ display: inline-block; }
    table{ border-spacing: 0; border-collapse: collapse; }
    form{ display: inline-block; width: 100%; }
    input{ vertical-align: middle; outline: 0; }
    textarea{ resize: none; line-height: 20px; overflow-y: auto;  }
    button{ border: none; background: none; text-align: center; }
    :focus{ outline: 0; }
    展开全文
  • css样式重置Many frontend developers begin styling their websites with Normalize. Some developers have personal preferences that they add on to Normalize.css. I have my preferences, too. 许多前端开发...
  • vue css样式重置

    千次阅读 2018-11-04 11:21:09
    css样式重置官网 在static下新建一个css文件夹再创建一个 reset.css的文件把在官网中Toolbox下的样式粘贴进去 然后在index.html中引入 <link rel="stylesheet" href="./static/css/...
  • css 样式重置模板

    2020-04-24 22:49:40
    css样式重置模板 /* CSS Document */ body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,dl,dt,dd,input {margin:0;padding:0;} body{font-size:12px;} img{border:none;} li{list-style:none;} ...
  • 常见网站CSS样式重置

    千次阅读 2018-11-16 16:07:55
    常见网站CSS样式重置  腾讯 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0} body{font:12px "宋体","Arial Narrow",...
  • 为什么会有css样式重置代码? 由于html标签在各个浏览器的默认css中表现差异化,为了统一布局,所以需要先重置样式。当然网上有很多这类型的css,这里我罗列出必须的,精简的代码。 直接拷贝一下代码到您的css最...
  • CSS重设就是由于各种浏览器解释CSS样式的初始值有所不同,导致设计师在没有定义某个CSS属性时,不同的浏览器会按照自己的默认值来为没有定义的样式赋值,所以我们要先定义好一些CSS样式,来让所有浏览器都按照同样的...
  • 分享一下CSS样式重置代码

    千次阅读 2017-10-15 19:08:02
    通过借鉴网上大牛们的经验和自己在工作中碰到的一些问题,总结出了这些比较常用的CSS样式重置的代码: @charset "utf-8"; /* 防止用户自定义背景颜色对网页的影响,添加让用户可以自定义字体 */ html{ color: ...
  • CSS样式清除和重置是前端开发必需要做的事情,结合了前辈们的经验整理了一份CSS重置样式代码不敢独享特此与大家分享下,感兴趣的朋友可不要错过了哈
  • CSS样式重置

    千次阅读 2020-02-20 21:52:15
    /*样式重置*/ html{ overflow-y:scroll;/*让非ie浏览器默认也显示垂直滚动条,防止因滚动条引起的闪烁*/ background-color:#fff; color:#3c3c3c; } /*清除内外边距*/ body,h1,h2,h3,...
  • 解決CSS在不同浏览器下的默认样式不相同的兼容CSS样式重置:点击打开链接
  • 非常好用的css样式重置

    千次阅读 2018-05-25 23:46:35
    将页面初始化为统一样式)有益于页面的布局,建议每个页面都重置样式我们在项目前期准备时都会准备好一个reset.css,因为不同浏览器对标签的解析各不相同,重置css样式可以让标签在不同浏览器下产生相同的效果(清楚...
  • Reset.css 样式重置

    千次阅读 2017-06-16 18:17:00
    CSS Reset是指重设浏览器的样式。在各种浏览器中,都会对CSS的选择器默认一些数值,譬如当h1没有被设置数值时,显示一定大小。但并不是所有的浏览器都使用一样的数值,所以有了CSS Reset,以让网页的样式在各浏览器...
  • 常见网页css样式重置

    2019-01-17 14:28:08
    /* 全局CSS定义 */ body{font-family:"\5B8B\4F53","Arial Narrow",HELVETICA;text-align:center;margin:0 auto;padding:0;background:#FFF;font-size:12px;color:#333;} body > div{text-align:center;margin-right...
  • @charset "utf-8";.../* CSS Document */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,pre, form, fieldset, input, textarea, p, blockquote, th, td {padding: 0; margin: 0;} fieldset, img...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 36,524
精华内容 14,609
关键字:

css样式重置