今天自己写css样式时,其中用到了<ul>标签,设置了一系列效果后运行,发现位置与设置有出入。chrome上打开检查项,发现<ul>标签的styles底部多了以下一段:

ul, menu, dir {

display: block;

list-style-type: disc;

-webkit-margin-before: 1em;

-webkit-margin-after: 1em;

-webkit-margin-start: 0px;

-webkit-margin-end: 0px;

-webkit-padding-start: 40px;

旁边显示来源是:user agent stylesheet
 
检查了html及css后,发现并无特别设置,html头中也做了标准设定。百度了”user agent stylesheet“之后,发现是浏览器针对不同html元素,会有相应的css默认设置。
解决的方法:
1、比较简单的一种方法:在css文件开头设置通配符样式,比如*{margin:0px;padding:0px;},覆盖掉浏览器的默认设置;
2、复杂一点的方法:了解通用的几种浏览器的默认设置,再单独写一个css文件,将需要修正的样式都写在里面,以后做项目时可以共用。

CSS之浏览器默认样式设置的更多相关文章

  1. CSS系列——浏览器默认样式

    了解HTML标签在各浏览器当中的默认样式,可以让我们了解,为什么会要写Reset.css,Reset.css当中要怎么写样式最合理.试着思考下面的问题: 为什么会有默认样式? 每个浏览器的默认样式有什 ...

  2. css清除浏览器默认样式

    css清除浏览器默认样式(代替 *{}) 将代码放入 css 文件,使用 link 引入. /* v2.0 | 20110126 http://meyerweb.com/eric/tools/css/ ...

  3. css遇到的那些坑——浏览器默认样式设置

    今天自己写css样式,其中用到了<ul>标签,设置了一系列效果后运行,发现位置与设置有出入.chrome上打开检查项,发现<ul>标签的styles底部多了以下一段: ul,  ...

  4. CSS之浏览器默认样式问题

    今天自己写css样式时,其中用到了<ul>标签,设置了一系列效果后运行,发现位置与设置有出入.chrome上打开检查项,发现<ul>标签的styles底部多了以下一段: ul, ...

  5. reset.css(重置浏览器默认样式)

    @charset "utf-8";html{background-color:#fff;color:#000;font-size:12px} body,ul,ol,dl,dd,h1 ...

  6. css知多少(4)——解读浏览器默认样式

    上一节<css知多少(3)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面的两层中,用户自定义样式一般也就是改一改字号大 ...

  7. css 框架——base.css,作用是重设浏览器默认样式和提供通用原子类。自己留存

    今天发下我自己的 css 框架——base.css,作用是重设浏览器默认样式和提供通用原子类. @charset "utf-8"; /*! * @名称:base.css * @功能 ...

  8. css知多少(4)——解读浏览器默认样式(转)

    css知多少(4)——解读浏览器默认样式   上一节<css知多少(3)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面 ...

  9. CSS 浏览器默认样式

    不要再说div天生就是block——这句话应该换成:浏览器默认样式天生规定了div是block——所以才导致了div是block!是默认样式规定的,不是浏览器的内核规定的. 没有设置block的元素, ...

随机推荐

  1. tableview的reloadData应注意

    http://blog.csdn.net/ouyangtianhan/article/details/7835041 http://stackoverflow.com/questions/160715 ...

  2. Warning: Attempt to present on whose view is not in模态跳转问题

    错误分析:            controller A present controller B ,前提是A的view要存在,如果不存在,就会报这个错.   解决方法:             将 ...

  3. 02 easyui -parser

    parser: 页面节点class=“easyui-” +组件名(在plugins里) ,则可以 渲染成相应的组件.

  4. Unity3D ——强大的跨平台3D游戏开发工具(五)

    第九章 图形用户界面类G.U.I 您在玩很多3D游戏的时候,不知是否注意到在游戏界面中,总有一些图形和文字信息是不随着3D视角的改变而改变的.这也是由于游戏本身的要求而决定的.比如说英雄的生命值,聊天 ...

  5. ajax 页面请求后,jsp页面定位

    如下图所示.A,B两区域为不动区域,既不随着滚动条的滚动而移动.C区域为异步加载内容区域, 在C区域中,点击查询按钮,需要异步加载查询 结果.但是查询结果会很长,这样子,就需要向下滑动滚动条,用户体验 ...

  6. IM 之 融云

    官方网站:http://www.rongcloud.cn 官方开发文档:http://www.rongcloud.cn/docs/ IM 融云 之 开发基础概念 IM 融云 之 通讯能力库API IM ...

  7. Python3基础 闭包 简单示例

    镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...

  8. DevExpress控件学习总结(转)

    DevExpress控件学习总结   1.Navigation & Layout 1.1 Bar Manager 如果想在窗体或用户控件(user control)上添加工具条(bars)或弹 ...

  9. 最通用的ibatis.Net使用sql server存储过程返回分页数据的详细例子

    ibatis.Net是一个比较简单和灵活的ORM框架,今天我分享一个我的项目中使用sql server通用存储过程来分页的一个例子,用ibatis.Net框架统一返回分页数据为IList<Has ...

  10. iOS 之 const

    const int a与 int const a一样. const int *a ;//指针可以修改,指向常整形的指针 int* const a;// 常指针, int* 作为一个整体被限制, 所以指 ...