许多问题可以直接引用CSS框架，例如bootstrap来解决
1.overflow 属性规定当内容溢出元素框时发生的事情
这个属性定义溢出元素内容区的内容会如何处理:滚动条，隐藏，显示在块级外等
一般默认visible
visible默认值。内容不会被修剪，会呈现在元素框之外。
hidden内容会被修剪，并且其余内容是不可见的。
scroll内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
inherit规定应该从父元素继承 overflow 属性的值。
2.盒子模型：(与box-sizing: border-box;)
设置了元素的宽度，实际展现的元素却超出你的设置：这是因为元素的边框和内边距会撑开元素。也就是说两个相同宽度的元素，当设置内外边距后，显示的实际宽度却不一样。
后来新增了一个叫做 box-sizing 的CSS属性。当你设置一个元素为 box-sizing: border-box; 时，此元素的内边距和边框不再会增加它的宽度。
CSS开发者想要页面上所有的元素都有如此表现。所以开发者们把以下CSS代码放在他们页面上：
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
这样可以确保所有的元素都会用这种更直观的方式排版。
不过 box-sizing 是个很新的属性，目前你还应该像我上面例子中那样使用 -webkit- 和 -moz- 前缀。这可以启用特定浏览器实验中的特性。同时记住它是支持IE8+的。
拓展：
box-sizing属性可以为三个值之一：content-box（default），border-box，padding-box
①content-box，border和padding不计算入width之内
②padding-box，padding计算入width内
③border-box，border和padding计算入width之内
3.定位
①static 是默认值--不被定位
任意 position: static; 的元素不会被特殊的定位。一个 static 元素表示它不会被positioned，一个 position 属性被设置为其他值的元素表示它会被positioned
②relative----相对定位
在一个相对定位的元素上设置 top 、 right 、 bottom 和 left 属性会使其偏离其正常位置。其他的元素的位置不会受该元素的影响，而发生位置改变来弥补它偏离后剩下的空隙。
③fixed---固定定位
一个固定定位元素会相对于视窗来定位，这意味着即便页面滚动，它还是会停留在相同的位置。和 relative 一样， top 、 right 、 bottom 和 left 属性都可用。
（注意：一个固定定位元素不会保留它原本在页面应有的空隙（脱离文档流））
④absolute---绝对定位
absolute 与 fixed 的表现类似，但是它不是相对于视窗而是相对于最近的“positioned”被定位的祖先元素。如果绝对定位的元素没有“positioned”祖先元素，那么它是相对于文档的 body 元素，并且它会随着页面滚动而移动。
（注意：一个“positioned”元素是指 position 值不是 static 的元素）
④clear---清除浮动
属性被用于控制浮动，定义了元素的哪边上不允许出现浮动元素
围住浮动元素，比如文字围绕图片效果
【清除浮动】
添加非浮动的清除元素：给父元素添加一个子元素，然后对该子元素应用clear样式。其中有几种方案。
第一种：添加元素
简单地在HTML中添加一个子元素div
<body>
<section>
<img src="sea.png" alt="sea">
<p>图片标题</p>
<div class="clear"></div>
</section>
<footer>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod</footer>
</body>
//在此，为div添加了一个类，以便于在CSS中写样式。
//css里
div.clear{
clear:left;
}
第二种：clearfix规则
如果你不想添加这个纯表现性的元素，有一个更好的方法——after伪类。
首先为section添加一个类clearfix
<section class="clearfix">
<img src="sea.png" alt="sea">
<p>图片标题</p>
</section>
<footer>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod</footer>
//然后，再使用这个神奇的clearfix规则
//CSS里
.clearfix:after{
content:".";
display:block;
height:0;
visibility:hidden;
clear:both;
}
//这个clearfix规则最早是由程序员Tony Aslett发明的，它只添加了一个清除的包含句点作为非浮动元素
4.居中对齐---margin: auto;
#main {
max-width: 600px;
margin: 0 auto;
}
使用 max-width 替代 width 可以使浏览器更好地处理小窗口的情况。这点在移动设备上显得尤为重要
设置左右外边距为 auto 来使其水平居中。元素会占据你所指定的宽度，然后剩余的宽度会一分为二成为左右外边距。
相关推荐
《CSS属性查询手册》是针对CSS 2.0版本的一份详尽参考资料，它为开发者提供了全面、深入的CSS属性理解和应用指南。CSS，即层叠样式表（Cascading Style Sheets），是用于描述HTML或XML（包括如SVG、MathML等各种XML...
"别具光芒——CSS属性、浏览器兼容与网页布局"这个主题涵盖了三个核心概念：CSS属性、浏览器兼容性和网页布局。 首先，我们来详细探讨CSS属性。CSS提供了无数的属性，如颜色、字体、大小、位置等，这些属性共同决定...
资源名称：CSS 属性兼容性对照表内容简介： CSS属性兼容性对照表 PDF，主要是列出一些CSS2.0/CSS2.1在各个版本的IE、火狐等主流浏览器下的兼容支持问题，此表有助于以后书写出全兼容的WEB标准化网页打下基础，前端...
最全最细的css属性思维导图，css所有的属性几乎都列在这里了。 注意这只是一个思维导图，没有对每个属性的具体描述，相当于只是css属性的一个罗列汇总。介意者慎载。
以下是一些常见的CSS属性及其详细解释，帮助你全面理解并掌握它们的用法。 一、HTML基本样式 在HTML中，一些基础样式可以通过标签来实现，如`<pre>`用于预格式化的文本，`<div>`作为内容的容器，`<font>`用于控制...
通过 `javascipt和css属性对照.doc` 文件，你可以系统地学习并对比这两种语言的属性，进一步提升你的前端技能。 记住，学习 JavaScript 和 CSS 的属性对照不仅仅是了解它们的用法，还要深入理解其工作原理，这样...
用的CSS属性列表汇总 用的CSS属性列表汇总 用的CSS属性列表汇总
### CSS属性继承详解 #### 一、引言 在网页设计与开发中，CSS（层叠样式表）是用于控制页面布局及外观的关键技术之一。其中，“CSS属性继承”是CSS一个非常重要的特性，它允许某些样式从父元素传递到子元素。这种...
本篇文章将详细解析CSS属性在JavaScript中的对应关系，并探讨如何在JavaScript中操作这些属性。 1. **颜色属性**： - `color`：在JavaScript中，可以使用`element.style.color`来设置或获取元素的文本颜色。 - `...
javaScript属性与CSS属性对照表，一般来说javascript与css的属性只要稍微改动一下就可以用了。
整理了常用的css属性，适用于新手查阅，熟悉css基本属性使用等等
CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页...
CSS 属性列表和属性值含义 CSS 属性列表和属性值含义是指在 CSS 样式表中使用的各种属性和它们的可能取值。了解这些属性和它们的含义是掌握 CSS 样式表编写的关键。 媒体类型(Media) CSS 样式表可以作用于多种...
3. **继承性**：某些CSS属性具有继承性，这意味着即使当前元素的属性值被设置为空，它仍然可能继承父元素的样式值。 4. **内联样式的优先级**：内联样式（即直接写在HTML标签中的style属性）具有较高的优先级，因此...
滚动条的css属性滚动条的css属性滚动条的css属性
这个文档是Dreamweaver CS6 CSS属性的一些参考，这个文档是根据Dreamweaver CS6官网上的信息进行编辑的，这个是我自己做的文档，第一次做的，所以排版效果可能不是很好，这个版本是图片版本，文字版本整理好后也会传...
### CSS属性大全：样式表的创建与样式表的属性 #### 概述 CSS（Cascading Style Sheets），即层叠样式表，是一种用于描述HTML文档外观和布局的语言。通过CSS，网页设计师能够精确控制页面元素的样式，包括字体、...
有时我们不需要某个css属性时，想删除它，但有没有removeCss方法，怎么办呢？ 可以使用如下方法解决 $(‘选择器’).css(‘css属性’,”); 即将css属性值赋值为空，页面中就不会显示该css属性了。 如：$(‘.div1...
在深入探讨Dreamweaver中的CSS编辑器及其对应的CSS属性之前，我们先来了解一下Adobe Dreamweaver。这是一款由Adobe公司开发的专业级Web设计工具，它为网页开发者提供了强大的可视化编辑环境，支持HTML、CSS、...
CSS属性选择器详解 CSS中的属性选择器是一种强大的选择器，允许开发者根据HTML元素的属性值来选择元素。今天，我们将深入探讨CSS属性选择器的详细解释。 什么是CSS属性选择器？ --------------------- CSS属性...