css3基础篇一】的更多相关文章

CSS3 文本阴影 在 CSS3 中,text-shadow 可向文本应用阴影. 您能够规定水平阴影.垂直阴影.模糊距离,以及阴影的颜色: 实例 向标题添加阴影: h1 { text-shadow: 5px 5px 5px #FF0000; } 2D Transform 方法 函数 描述 matrix(n,n,n,n,n,n) 定义 2D 转换,使用六个值的矩阵. translate(x,y) 定义 2D 转换,沿着 X 和 Y 轴移动元素.(重要的是不写定位也可以随意移动)与absolute不…
CSS3 边框 border-radius box-shadow border-image(ie不支持) 语法 border-radius: 1-4 length|% / 1-4 length|%; 注释:按此顺序设置每个 radii 的四个值.如果省略 bottom-left,则与 top-right 相同.如果省略 bottom-right,则与 top-left 相同.如果省略 top-right,则与 top-left 相同. 语法 box-shadow: h-shadow v-shad…
CSS3 选择器 选择器 例子 例子描述 CSS .class .intro 选择 class="intro" 的所有元素. 1 #id #firstname 选择 id="firstname" 的所有元素. 1 * * 选择所有元素. 2 element p 选择所有 <p> 元素. 1 element,element div,p 选择所有 <div> 元素和所有 <p> 元素. 1 element element div p…
多学一点总是好的~ 自始至终都觉得的css和html效果比较美观,于是在看慕课网教程时,自己也跟着敲了深爱着的前端代码 这部分分为两部分:①基础篇:http://www.imooc.com/learn/445: ②进阶篇:http://www.imooc.com/learn/598: 这里只对基础篇进行记录,下篇则为进阶篇介绍. 学到的something: 1.CSS的常规布局方法: 2.CSS扁平化风格布局方法 : 3.网页布局特殊情况处理方式 : 4.HTML5相关标签和CSS3效果. 项目…
今天给大家分享一篇关于CSS3基础教程 文章,主要是讲CSS3弹性盒模型.弹性布局的主要思想是让容器有能力来改变项目的宽度和高度,以填满可用空间(主要是为了容纳所有类型的显示设备和屏幕尺寸)的能力. 注意:Flexbox布局是最合适的一个应用程序的组件,以及小规模的布局,而网格布局是用于较大规模的布局. 盒模型的兼容性不佳,在使用时,需要加上浏览器的私有前缀. 父元素display:box或者display:inline-box; display: -webkit-box;display: -m…
form表单那点事儿(上) 基础篇 做为html中最为常见,应用最广泛的标签之一,form常伴随前端左右.了解更深,用的更顺. 目录: 表单属性 表单元素 常识 模拟外观 表单属性 这个表单展示了form表单常用的属性 属性名 属性值 描述 action 一个url地址 指定表单提交到的地址 method `GET` , `POST` 表单将以此种方法提交到服务器 target `_self` 当前页面 `_blank` 每次在新窗口打开 `blank` 每次在同一个新窗口打开 `_parent…
目录 这是<前端总结·基础篇·CSS>系列的第一篇,主要总结一下布局的基础知识. 一.显示(display) 1.1 盒模型(box-model) 1.2 行内元素(inline) & 块元素(block) 1.3 行内块元素(inline-block IE8+ IE6-7/tools) 1.4 flex(IE11+ IE10/-ms-) 1.5 none 二.位置(position) 三.补充 3.1 浮动(float) 3.2 层叠(z-index) 3.3 溢出(overflow…
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·CSS(四)兼容 目录 一.动画(animation)(IE10+)(CSS3) 1.1 定义动画 1.2 引用动画 1.3 多个动画 1.4 更多属性 二.过渡(transition)(IE10+)(CSS3) 2.1 定义首尾 2.2 应用过渡 2.3 多个过渡 2.4 更多属性 三.转换(transform)(IE10+,-ms-,-webkit-,-…
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 目录 一.移动端 1.1 视口(viewport) 1.2 媒体查询(media query) 1.3 相对字体大小(rem/em) 二.选择器 2.1 常用 2.2 关系 2.3 伪元素 2.4 伪类 2.5 优先级 三.样式重置(reset) 3.1 常用重置 3.2 重置插件(Normalize.css) 四.浏览器前缀 4.1 前缀由来 4.2 解决方案 五.兼容性…
常见移动web适配方案一般有3种方法,如下图: ①:定高,宽度百分比(一般用来做一些适配性不高的页面,比如主要以一些文字和图片为主的网页或移动端的头部和底部) ②:flex (更多的用于复杂页面的布局.具体参照阮一峰大神写的-Flex 布局教程:语法篇和实例篇 http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool (语法篇) http://www.ruanyifeng.com/blog/2015/0…