css
-
CSS中清除浮动的几种方法
一、clear:both; 这种方法有一个问题：margin失效。 二、隔墙法 /*墙*/ cl{ clear: both; } .hl{ height: 16px; } 演化出的“内墙法” /*两个p都浮动，所以p不会被撑出高*/ /*在家里建一堵墙就能让儿子给p撑出高*/ 注意：一般不使用此方法…
-
关于CSS的优先级和继承问题
text-align: center”>CSS的优先级和继承问题 ★css的冲突,即优先级 css本身的设置可以同时应用多个样式在同一个元素，此时样式之间可能出现冲突而达不到用户所想要的效果。★解决css冲突的优先级规则： ● css层叠样式表引入方法的优先级：内联式>内…
-
CSS如何实现两端对齐详解
前面的话 两端对齐在导航nav的制作中非常常用。本文将详细介绍css两端对齐的3种实现方式 flex 弹性盒模型flex作为强大的弹性布局方式，可以hold住大部分的布局效果，当然也包括两端对齐。可以使用主轴对齐justify-content的两端对齐属性space-between just…
-
css样式之border-radius详解
border-radius 属性设置边框的园角 可能的值：像素，百分比 扩展延伸 html代码 css代码 p { height: 200px; width: 200px; border: 2px solid #a72525; border-radius: 10px;} 结果 立即学习“前端…
-
使用css新单位vw,vh在响应式设计中的应用方法
考虑到未来响应式设计的开发，如果你需要，浏览器的高度也可以基于百分比值调整。但使用基于百分比值并不总是相对于浏览器窗口的大小定义的最佳方式，比如字体大小不会随着你窗口改变而改变，如今css3引入的新单位明确解决这一问题。 css3引入的”vw”和”vh”基于宽度/高度相对于窗口大小，”vw”=”vi…
-
使用css给未知宽高的元素添加背景图片方法
给页面的某一元素添加背景图片，当没有指定具体的宽高时，是无法显示效果的 1、添加背景图 HTML代码： *{margin:0; padding:0;} #wrap{ width:100%; height:auto; background:url(‘images/page.jpg’) no-repea…
-
CSS进阶之CSS的技巧分享
如何设置水平居中？ 分两种情况 行内元素与块级元素 1.行内元素（如图片 文字） div.textcenter{ text-align:center; } hello joe! 2.块级元素 块级元素的水平居中又分为两种 定宽块状元素 和 非定宽块状元素 立即学习“前端免费学…
-
CSS进阶之布局模型实例详解
css中含有三种布局模型 流动模型flow 浮动模型float 层模型layer 流动模型 网页默认的布局模型 特点有两个 1.块状元素都会在所处的包含元素内自上而下按顺序垂直延伸分布，因为在默认状态下，块状元素的宽度都为100%。实际上，块状元素都会以行的形式占据位置。 h1,p,div{ b…
-
box-shadow IE8兼容处理方法介绍
根据canisue（http://caniuse.com/#search=box-shadow），box-shadow兼容性如下图所示： 测试代码： * { margin: 0; padding: 0; } #header { width: 400px; height: 400px; margin:…
-
border-radius IE8兼容处理方法介绍
根据canisue（http://caniuse.com/#search=border-radius），border-radius兼容性如下图所示： 测试代码： * { margin: 0; padding: 0; } #header { width: 400px; height: 400px; m…
