随笔分类 -  HTML+CSS

用svg实现不规则形状
摘要：像这种弧形，用纯html和css很难写，但是用svg就简单多了。 可以用作图工具画出一个弧形，然后导成svg格式。在页面中，下面的白块就是div+svg构成 （这里用的是pug模板） 两种弧度的切换，主要是在hover的时候修改path值即可（注意两个svg大小一样） 如果不写过渡css，这两种弧形 阅读全文
posted @ 2018-08-27 17:31 *茉莉花开* 阅读(1901) 评论(0) 推荐(1)
css3知识
摘要：一、box-sizing 属性 规定两个并排的带边框的框 二、align-items (适用于父类容器上) 设置或检索弹性盒子元素在侧轴（纵轴）方向上的对齐方式。 值： flex-start：弹性盒子元素的侧轴（纵轴）起始位置的边界紧靠住该行的侧轴起始边界。 flex-end：弹性盒子元素的侧轴（纵 阅读全文
posted @ 2016-05-05 15:32 *茉莉花开* 阅读(393) 评论(0) 推荐(0)
HTML标签marquee实现滚动效果
摘要：html标签 - <marquee></marquee>可以实现多种滚动效果，无需js控制。使用marquee标记不仅可以移动文字，也可以移动图片，表格等.只需要在<marquee></marquee>内部输入要滚动的内容即可。 一、标签属性 1.滚动方向direction（包括4个值：up、 do 阅读全文
posted @ 2016-04-25 21:18 *茉莉花开* 阅读(18455) 评论(0) 推荐(3)
HTML DOM基础知识
摘要：HTML DOM基础知识 一、什么是DOM？ 1、HTML DOM 定义了访问和操作HTML文档的标准方法。 2、HTML DOM 把 HTML 文档呈现为带有元素、属性和文本的树结构（节点树）。 3、通过 JavaScript，您可以重构整个 HTML 文档。您可以添加、移除、改变或重排页面上的项 阅读全文
posted @ 2016-03-20 09:51 *茉莉花开* 阅读(711) 评论(0) 推荐(0)
BootStrap学习笔记
摘要：BootStrap笔记 一．BootStrap简介 1、Bootstrap的由来 2011年，twitter的“一小撮”工程师为了提高他们内部的分析和管理能力，用业余时间为他们的产品构建了一套易用、优雅、灵活、可扩展的前端工具集--BootStrap。Bootstrap由MARK OTTO和Jaco 阅读全文
posted @ 2016-03-12 13:57 *茉莉花开* 阅读(1342) 评论(5) 推荐(5)
浮动模型详解及其应用
摘要：一、浮动布局的五个基本特征： 1、任何定义为float的元素都会自动被设置为一个块状元素显示，相当于被定义display：block；声明。这样就可以为浮动元素定义width和height属性，即使是内联显示元素也可以。 当我们没有指定浮动元素宽度时，浮动元素会自动收缩到能够包含内容的宽度。而块状元 阅读全文
posted @ 2015-12-13 20:25 *茉莉花开* 阅读(1290) 评论(0) 推荐(0)
CSS布局属性
摘要：弹性盒模型（ Flexible Box 或 Flexbox）是一个CSS3新增布局模块，官方称为CSS Flexible Box Layout Module，用于实现容器里项目的对齐、方向、排序（即使在项目大小位置、动态生成的情况）。弹性盒模型最大的特性在于，能够动态修改子元素的宽度和高度，以满足在 阅读全文
posted @ 2015-12-01 15:32 *茉莉花开* 阅读(540) 评论(2) 推荐(0)
HTML标签的改变
摘要：HTML标签的改变：新增标签、重新定义的标签等 阅读全文
posted @ 2015-12-01 14:12 *茉莉花开* 阅读(1045) 评论(3) 推荐(0)
CSS3总结
摘要：CSS3总结，讲解了css3动画、多列等效果 阅读全文
posted @ 2015-11-28 21:25 *茉莉花开* 阅读(1217) 评论(4) 推荐(4)
CSS知识点补充
摘要：css知识点补充，包括css边框、浮动等 阅读全文
posted @ 2015-11-28 15:05 *茉莉花开* 阅读(522) 评论(0) 推荐(1)
CSS基础
摘要：CSS基础，包括CSS背景、文本、字体、轮廓等知识点的讲解。 阅读全文
posted @ 2015-11-27 21:03 *茉莉花开* 阅读(473) 评论(0) 推荐(0)
HTML5新特性总结
摘要：HTML5新特性总结，包括视频、音频、画布等标签的使用和案例。 阅读全文
posted @ 2015-11-27 17:17 *茉莉花开* 阅读(10502) 评论(3) 推荐(4)
HTML知识点总结以及典型例子讲解
摘要：归纳了HTML基础标签及其使用案例，包括文本格式化、表格、图像以及基本布局等 阅读全文
posted @ 2015-11-26 19:22 *茉莉花开* 阅读(2611) 评论(2) 推荐(2)
HTML5样式和列表、CSS链接的四种状态
摘要：主要讲解HTML5样式和列表、CSS链接的四种状态等知识 阅读全文
posted @ 2015-11-25 18:58 *茉莉花开* 阅读(7490) 评论(0) 推荐(0)
HTML5中表单的创建
摘要：HTML5中常见的表单标签以及使用案例 阅读全文
posted @ 2015-11-19 17:57 *茉莉花开* 阅读(3956) 评论(0) 推荐(1)