随笔分类 -  CSS

摘要:随着对分离HTML元素的语义重要性与其表现的影响的不断强调,CSS在HTML5元素布局方面的作用越来越重要。 1. 定位内容 控制内容最简单的方式就是通过定位,这允许你使用浏览器改变元素的布局方式。 1.1 设置定位类型 position 属性设置了元素的定位方法。 position 属性的不同值指 阅读全文
posted @ 2016-08-17 19:41 Luka.Ye 阅读(459) 评论(0) 推荐(1) 编辑
摘要:1. 设置元素的颜色和透明度 前面有介绍CSS颜色的各种用法,如 background-color属性、boder-color属性等。还有另外两个与颜色有关的属性。 1.1 设置前景色 color属性设置元素的前景色。一般而言,元素对color属性之于它的意义可以有不同的解读,不过实际上,color 阅读全文
posted @ 2016-07-23 04:47 Luka.Ye 阅读(436) 评论(0) 推荐(0) 编辑
摘要:1. 使用过渡 过渡效果一般是由浏览器直接改变元素的CSS属性实现的。例如,如果使用:hover选择器,一旦用户将鼠标悬停在元素之上,浏览器就会应用跟选择器关联的属性。 当用户将鼠标悬停在span元素上的时候,浏览器就会响应,直接应用新的属性。变化如下图所示: CCS过渡属性允许控制应用新属性值的速 阅读全文
posted @ 2016-07-20 21:47 Luka.Ye 阅读(13569) 评论(2) 推荐(5) 编辑
摘要:盒子是CSS中的基础概念,我们需要使用它来配置元素的外观以及文档的整体布局。 1. 为元素应用内边距 应用内边距会在元素内容和边距之间添加空白。我们可以为内容盒的每个边界单独设置内边距,或者使用 padding 简写属性在一条声明中设置所有的值。 如果使用百分数值指定内边距,百分数总是根包含块的宽度 阅读全文
posted @ 2016-07-19 19:06 Luka.Ye 阅读(789) 评论(1) 推荐(2) 编辑
摘要:1. 应用边框样式 先从控制边框样式的属性开始。简单边框有三个关键属性:border-width、border-style 和 border-color 。 在代码中,使用了p元素定义了一个段落,使用 style 元素为这个段落应用边框样式,边框样式是通过设置 border-width、border 阅读全文
posted @ 2016-07-16 21:09 Luka.Ye 阅读(4506) 评论(0) 推荐(0) 编辑
摘要:1. 使用结构性伪类选择器 使用结构性伪类选择器能够根据元素在文档中的位置选择元素。这类选择器都有一个冒号字符前缀(:),例如 :empty 。它们可以单独使用,也可以跟其他选择器组合使用,如: p:empty 。 1.1 使用根元素选择器 该选择器的效果如下,边框抱着整个文档: 1.2 使用子元素 阅读全文
posted @ 2016-07-16 19:52 Luka.Ye 阅读(737) 评论(0) 推荐(0) 编辑
摘要:CCS选择器的作用是找出某类元素。以便使我们使用style元素或者外部样式表对这类元素设置样式。 1.使用CSS基本选择器 有些选择器使用起来非常简单,我们把这部分选择器称为基本选择器(basic selector)。开发人员可使用这类选择器在文档中进行比较宽泛的选择,也可以将其看作结合多种选择器进 阅读全文
posted @ 2016-07-16 14:38 Luka.Ye 阅读(570) 评论(0) 推荐(0) 编辑
摘要:CSS(Cascading Style Sheet,层叠样式表),及其精巧且富有表达力,开发者可以用最为高效的方式高度掌控网页内容的表示。 1. 盒模型 CSS中的一个基本概念是盒模型(box model)。可见元素会在页面中占据一个矩形区域,该区域会在页面中占据一个矩形区域,该区域就是元素的盒子, 阅读全文
posted @ 2016-07-15 18:22 Luka.Ye 阅读(407) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示