基础样式 base.css

最新推荐文章于 2024-08-26 07:13:35 发布

米咪米

最新推荐文章于 2024-08-26 07:13:35 发布

阅读量288

点赞数

分类专栏： CSS 文章标签： css

本文链接：https://blog.csdn.net/weixin_52063946/article/details/118673949

版权

CSS 专栏收录该内容

9 篇文章 2 订阅

订阅专栏

本文介绍了如何通过CSS和HTML实现页面布局的优化，消除默认边距，保持字体正常显示，移除列表点，定义响应式版心，处理图片样式，并讲解了按钮和链接的美化。此外，还涵盖了清除浮动、隐藏元素和前端开发常用的最佳实践。

摘要由CSDN通过智能技术生成

/*清除元素默认的内外边距*/



* {

    margin: 0;

    padding: 0;

}




/*让所有斜体不倾斜*/



em,

i {

    font-style: normal;

}




/*去掉列表前面的小点*/



li {

    list-style: none;

}




/*版心*/



.layout{

    width: 1200px;

    margin: 0 auto;

}




/*图片没有边框，去掉图片底侧的空白缝隙*/



img {

    border: 0;

    /*ie6*/

    vertical-align: middle;

}




/*让button按钮变成小手*/



button {

    cursor: pointer;

}




/*取消链接的下划线*/



a {

    text-decoration: none;

}



button,

input {

    font-family: 'Microsoft YaHei', 'Heiti SC', tahoma, arial, 'Hiragino Sans GB', \\5B8B\4F53, sans-serif;

    /*取消轮廓线*/

    outline: none;

}



body {

    background-color: #fff;

    font-family: 12px/1.5 'Microsoft YaHei', 'Heiti SC', tahoma, arial, 'Hiragino Sans GB', \\5B8B\4F53, sans-serif;

    color: #666;

}




/*隐藏某个元素*/



.hide,

.none {

    display: none;

}




/*清除浮动*/



.clearfix:after {

    visibility: hidden;

    clear: both;

    display: block;

    content: ".";

    height: 0;

}



.clearfix {

    *zoom: 1;

}