随笔分类 -  CSS

Web前端学习第十三天·fighting_HTML页面设计技巧总结（二）
摘要：行级元素之间的空白距离 如下图所示：（看似是一张图，实际上是三张图分别放在<a>标签中实现，如果没有经过特殊的处理，那么图与图之间就会留有空隙，影响页面布局的效果） 示例代码如下： 运行结果： 此时需要把html文档中行级标签之间的距离都去掉，即将所有的<a>标签写在同一行中且之间没有距离即可。如下 阅读全文
posted @ 2016-05-28 15:34 Candy1029 阅读(2818) 评论(18) 推荐(8)
Web前端学习第十二天·fighting_HTML页面设计技巧总结（一）
摘要：公共和个性化样式的合并 灵感：来自京东首页滚动广告右边的图标，如下图所示。 提取公共部分样式，个性化的再单独设置。 示例代码如下： 运行结果： 分类菜单布局的实现 从整体上搭好框架，如下：（我一定是来搞笑的……） “上部分类”做父容器。“左分类”使用冲出层样式，设定它的高度比父容器的高度还要高。 “ 阅读全文
posted @ 2016-05-27 21:12 Candy1029 阅读(2258) 评论(28) 推荐(7)
Web前端学习第十二天·fighting_使用CSS布局和定位（二）
摘要：我是要成为后宫佳丽三千的男人啊~ 用户界面样式 outline 复合属性（outline-width、outline-style、outline-color），设置对象外的线条轮廓。outline画在border外面。 使用频率一般，在H5中不建议使用。 语法与border的使用类似。 示例代码如下 阅读全文
posted @ 2016-05-27 18:44 Candy1029 阅读(390) 评论(4) 推荐(0)
Web前端学习第十一天·fighting_使用CSS布局和定位（一）
摘要：元素布局 display 设置对象是否及如何显示。IE7以下的浏览器不支持table相关的参数值。 红色颜色显示的属性值为常用的值。 语法：display：none（隐藏对象，与visibility属性的hidden值不同，其不为被隐藏的对象保留其物理空间） | inline（指定元素为内联元素） 阅读全文
posted @ 2016-05-26 21:26 Candy1029 阅读(867) 评论(14) 推荐(8)
Web前端学习第十天·fighting_盒子模型
摘要：什么是盒子模型 一个页面元素由：元素、边框、内边距、外边距构成。 width和height通常指元素的高度和宽度。元素的实际高度和宽度的计算如下图所示：（元素的宽度和高度是不加外边距margin的，展位的宽度和高度需要加上margin） 技巧：margin-left=margin-right=aut 阅读全文
posted @ 2016-05-25 21:53 Candy1029 阅读(1200) 评论(7) 推荐(4)
Web前端学习第十天·fighting_使用CSS美化文字（三）
摘要：CSS3颜色渐变 background-image:linear-gradient(black,blue,green,red); 默认从上到下显示。 示例代码： background-repeat背景图片平铺 背景填充的方式。 语法：background-repeat：<repeat-style>[ 阅读全文
posted @ 2016-05-25 15:33 Candy1029 阅读(979) 评论(0) 推荐(9)
Web前端学习第九天·fighting_使用CSS美化文字（二）
摘要：line-height的继承性 子标签可以继承父标签中的line-height属性，不管他是行级标签还是块级标签。 块级标签可以覆盖父标签的line-height属性。（块级元素的继承性，当子元素是块级元素并且设定了自己的line-height属性时，它的line-height由自己决定。） 行级标 阅读全文
posted @ 2016-05-24 23:51 Candy1029 阅读(1176) 评论(2) 推荐(0)
Web前端学习第八天·fighting_使用CSS美化文字（一）
摘要：CSS属性值的分类 文档中属性值语法符号的意思：|（表示选择其中的一个属性值）、||（表示可以同时出现）、<>（表示该属性值包含多种赋值情况）、[]（表示可选值，可要可不要）、&&（两个都必须出现），还有与正则表达式相同的。 例如：font-style:normal|italic|oblique b 阅读全文
posted @ 2016-05-23 21:25 Candy1029 阅读(742) 评论(5) 推荐(2)
Web前端学习第七天·fighting_CSS样式的编写和使用（二）
摘要：属性选择器 目前使用的并不多。新浪和京东有使用。 可以根据元素的属性即属性值来选择元素。 单个属性时的语法：*[属性名称]{样式} 例如：（表示所有有href属性的标签） 上面的代码中表示span标签中具有href属性的元素，给它的内容的颜色设置为红色。span中的href属性并没有实际意义。 多个 阅读全文
posted @ 2016-05-22 15:43 Candy1029 阅读(694) 评论(3) 推荐(3)
Web前端学习第六天·fighting_CSS样式的编写和使用（一）
摘要：移动页面开发（使用html5+css3 或者 使用JQueryMobile框架） CSS Cascading Style Sheets 层叠样式表。 定义如何显示HTML标签。不使用样式的话，相同的标签表现方式都是一样的，不够美观。 样式主要内容包括选择器和属性两部分。 样式属性示例：color（标 阅读全文
posted @ 2016-05-21 22:18 Candy1029 阅读(1016) 评论(1) 推荐(3)