怪异盒子模型:css3 box-sizing布局

怪异盒子模型:css3 box-sizing布局

        盒子模型        关于CSS重要的一个概念就是CSS盒子模型。它控制着页面这些元素的高度和宽度。盒子模型多少会让人产生一些困惑,尤其当涉及到高度和宽度计算的时候。真正盒子的宽度(在页面呈现出来的宽度)和高度,需要加上一些其它的属性,例如:padding + border + width= 盒子的宽度padding+ border + height =
浏览:1116 分类:CSS3 标签: box-sizing css3
移动端开发去除默认css样式/overflow问题

移动端开发去除默认css样式/overflow问题

        清除点击阴影:-webkit-tap-highlight-colora,input,button{-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}        清除按钮圆角 (ios上):-webkit-appearanceinput,button {-webkit-appearance: none;border
浏览:1246 分类:移动开发 标签: 移动端 css
用css里的 viewport-fit 标签应对iphone x的刘海

用css里的 viewport-fit 标签应对iphone x的刘海

        iPhone X 配备一个覆盖整个手机的全面屏,顶部的“刘海”为相机和其他组件留出了空间。然而结果就是会出现一些尴尬的情景:网站被限制在一个“安全区域”,在两侧边缘会出现白条儿。移除这个白条儿也不难,给 body 设置一个 background-color 就可以搞定。或者,可以添加 viewport-fit=cover meta 标签,将整个网站扩展到整个屏幕
浏览:1050 分类:CSS3 标签: viewport-fit css iphone
css3实现超出指定文本以省略号显示效果

css3实现超出指定文本以省略号显示效果

css3实现超出指定文本以省略号显示效果:一种是单行显示省略号;另一种是自己可以控制几行,最后一行末尾才显示省略号。css样式.text01 {width:200px;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;-webkit-text-overflow:ellipsis;-moz-text
浏览:1018 分类:插件/功能 标签: css3 省略号
《HTML5与CSS3实战指南》pdf下载

《HTML5与CSS3实战指南》pdf下载

        《HTML5与CSS3实战指南》主要介绍HTML5和CSS3的新功能,内容系统全面,易于理解。《HTML5与CSS3实战指南》由11章和3个附录组成,内容包括HTML5和CSS3简介、HTML5标记、HTML5语义、HTML5表单、HTML5音频和视频、CSS3渐变和多背景、CSS转换和过渡、嵌入字体和多列布局、地理定位、离线Web应用和Web存储、画布、SVG
浏览:1139 分类:前端书籍 标签: html5 css3
《DIV+CSS 3.0网页布局案例精粹》PDF下载

《DIV+CSS 3.0网页布局案例精粹》PDF下载

        《DIV+CSS 3.0网页布局案例精粹》系统地介绍了CSS样式的基础理论和实际应用技术,并结合实例来介绍使用Div+CSS布局制作网页的方法和技巧。在介绍使用CSS样式进行设计的同时,还结合实际网页制作中可能遇到的问题,提供了解决问题的思路、方法和技巧,使初学者可以轻松地掌握Div+CSS布局的方式,制作出精美的网页。 本书全面展现了使用Div+CSS进行网
浏览:1206 分类:前端书籍 标签: css3 div
清除浮动的几种方法

清除浮动的几种方法

        一、什么是浮动?        原理: 在css中使用float:left和float:right,使元素脱离文档流。同时显示为类似display:inline-block的形式(可以定义宽高,但是又不会换行)。最大好处是相比于之前的table布局的,更具有灵活性。                二、不清除浮动会产生什么后果?        比如 我想要
浏览:1138 分类:HTML/CSS 标签: 浮动 css
新手如何书写优雅CSS代码

新手如何书写优雅CSS代码

        最近,经常有朋友问我一些工作中遇到的CSS问题。他们总是不能很好的控制CSS,影响CSS的效率发挥。我来分析总结一下错误所在,帮助大家更加容易使用CSS。 本文总结
浏览:1042 分类:HTML/CSS 标签: css
flexbox布局的正确使用姿势

flexbox布局的正确使用姿势

flex-direction:row-reverse vs box-orient:horizontal;box-direction:reverse        在项目中,我们还会
浏览:1007 分类:移动开发 标签: flexbox css3
《CSS3实战》pdf下载

《CSS3实战》pdf下载

        全书一共分为9章,首先从宏观上介绍了CSS 3技术的最新发展现状、新特性,以及现有的主流浏览器对这些新特性的支持情况;然后详细讲解了CSS 3的选择器、文本特性、颜
浏览:915 分类:前端书籍 标签: css3
flexbox布局之项目属性设置

flexbox布局之项目属性设置

            项目下的属性介绍           1、order:order属性定义项目的排列顺序;数值越小,排列越靠前,默认为0。            <!DO
浏览:1213 分类:CSS3 标签: flexbox flex css3
flexbox布局之父容器属性设置

flexbox布局之父容器属性设置

        父容器下的属性介绍        1、display : flex        2、flex-direction:决定主轴的方向            ro
浏览:1183 分类:CSS3 标签: flexbox flex css3

邮箱快速注册

忘记密码