- 博客(6)
- 收藏
- 关注
RSS订阅原创 Flex（弹性）布局实例
骰子的布局 下面，就来看看Flex如何实现布局。 你可以到codepen查看Demo 如果不加说明，本节的HTML模板一律如下： <div class="box"> <span class="item"></span> </div> 上面代码中，div元素（代表骰子的一个面）是Flex容器，span元素（代表一个点）是Flex项目。如果有多个项目，就要添加多个span元素，以此类推。 单项目 首先只有左上角有一个点。 Flex布局默认就是首行左对齐，所
2020-07-27 11:33:59
179
原创 Flex布局（弹性布局）
HTML代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Flex 布局示例</title> <link rel="stylesheet" href="flex.css"> </head> <body> <h2>容器的属性</h2> ..
2020-07-24 12:02:24
122
转载 布局
一、静态布局 静态布局就是传统的网站形式，网页上的所有元素的尺寸一律使用px作为单位。 1.布局特点 不管浏览器尺寸具体是多少，网页布局始终按照最初写代码时的布局来显示。常规的pc的网站都是静态（定宽度）布局的，也就是设置了min-width，这样的话，如果小于这个宽度就会出现滚动条，如果大于这个宽度则内容居中外加背景，这种设计常见于pc端。 2.设计方法 --------PC-------- 居中布局，所有样式使用绝对宽度/高度(px)，设计一个Layout，当窗口缩小时，内容被遮挡，呈现横竖向滚动条。
2020-07-22 18:46:57
107
原创 CSS清除浮动
cLear清除浮动（添加空div法）： 在浮动元素下方添加空div，并给该元素写CSS样式：{clear:both; height:o; overflow:hidden;},但缺点就是如果页面浮动布局多的话，就要添加很多空div去清除浮动，不便优化，不建议使用。属性值有left、right、both 给浮动元素父级设置高度： 我们知道了高度塌陷是因为浮动元素的父级高度是自适应导致的，那么我们给它设置适当的高度就可以解决这个问题了。缺点：在浮动元素高度不确定的时候不适用。 以浮制浮（父级同时浮动）： 何谓“以
2020-07-19 19:42:04
97
原创 HTML5 form表单
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!--action:指定当单机表单内的确认按钮时，该表单被提交到那个地址（绝对或相对地址）。该属性必填。 method:指定提交表单时发送何种请求，该属性有get和post两种属性值，通常建议发送post请求，该属性必
2020-07-14 10:21:42
110
原创 CSS选择器
CSS选择器 通配符 语法：*{属性：属性值；} *{margin: 0; padding: 0;} 页面所有元素都会应用该样式。 元素选择器/标签选择器 语法：元素名称{属性：属性值；} p{color:red;} 元素选择器就是以结构中元素名称作为选择器。所有的页面元素都可以作为选择器。 Class选择器 语法：.class名{属性：属性值；} <style type="text/css"> .p1{属性: 属性值;} </style> <
2020-07-13 19:06:02
65
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人