![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5、CSS3
马马虎虎敲可爱
这个作者很懒,什么都没留下…
展开
-
HTML的常用标签整理
HTML(HyperText Markup Language) 超文本标记语言 XHTML 可扩展超文本标记语言 – – W3C 万维网联盟 – – ECMA 欧洲电脑厂商联合会 – – h1-h6 标题标签 – – p 段落标签 – – b、strong 加粗标签 – – i、em 倾斜标签 – – br 换行标签 – ...原创 2019-05-02 13:04:54 · 216 阅读 · 0 评论 -
CSS选择器
1.选择器 基本选择器 群组选择器(并集选择器) 交集选择器:多个选择器之间没有空格,表示同时满足多个选择器要求的元素才会被获取到 层次选择器 1.后代选择器:用空格隔开基本选择器,表示后一个选择器是前面的后代 2.子代选择器:用>隔开基本选择器,表示后一个选择器是前面的子代 3.相邻兄弟选择器:E+F:表示获取到E后面的紧跟着的F元素(同级的) 4.兄弟选择器:E~F:...原创 2019-05-03 14:43:50 · 162 阅读 · 0 评论 -
内外联以及权重
外部样式: <link rel="stylesheet" type="text/css" href="目标文件的路径及文件名全称" /> 内联样式语法: <标签 style=“属性:属性值;属性:属性值;”></标签> 1、样式表的作用域 行内(内联)样式的作用域是当前标签,内部样式的作用域是当前文件,外部样式表的作用域是有关联的所有文件。 2、样式表的优先...原创 2019-05-03 14:35:25 · 930 阅读 · 0 评论 -
宽高自适应以及常见浏览器兼容
(一)宽度自适应 1.若块级元素宽度不设置,或者设置成100%,都是占据其父级元素的一整行 应用场景: (1)页面最外层的盒子一般都要占据屏幕的大小,所以宽度100%。 (2)子元素使用百分比表示盒模型任意部分大小的话,代表的是子元素盒模型任意部分尺寸=父元素宽度百分比(除了高度外,子元素高度=父元素高度百分比)==>忽略; (二)高度自适应 1.父元素高度由子元素撑开 (1)...原创 2019-05-03 14:28:19 · 1501 阅读 · 0 评论 -
position定位属性
一、定位:position 1.static 默认值。位置设置为 static 的元素会正常显示,它始终会处于文档流给予的位置(static 元素会忽略任何 top、bottom、left 或 right 声明)。 2.absolute 相对于父级元素的绝对定位,浮出、脱离布局流,它不占据空间,就是我们所说的层,其位置相对于最近的已定位父元素而言的位置,可直接指定 “left”、“top”、“ri...原创 2019-05-03 14:20:00 · 877 阅读 · 0 评论 -
弹性盒布局、媒体查询
(一)弹性盒 1.设置在容器(父元素上)上: (1)display:flex; 父元素设置成弹性盒。 规定子项目在父元素主轴方向一行显示,不会换行。侧轴方向会默认拉伸。 (2)设置主轴方向 flex-direction 属性值: row 默认为水平向右 column 垂直向下 row-reverse 水平向左 ...原创 2019-05-03 13:56:11 · 778 阅读 · 0 评论 -
表格
数据表格的作用及组成 作用:显示数据 组成: <table> <tr>行 <td>单元格</td> <td></td> </tr> </table> *数据表格的相关属性 width=“表格的宽度” height=“表格的高度” border=“表格的边框” bgcolor=“表格的背景色...原创 2019-05-03 13:47:47 · 269 阅读 · 0 评论 -
表单
一、 1.表单框: <form name="表单名称" method="post/get" action="#"></form> 2.文本框 <input type="text" value="默认值"/> 3.placeholder=“输入框内容” <input type="text" placeholder=”框内显示内容 ”> 4.密码框 ...原创 2019-05-02 17:57:29 · 140 阅读 · 0 评论 -
3D变换
3D变换 1.transform之3d移动变换: transform:translate3d(x,y,z) z:代表在垂直于平面的轴上移动,电脑屏幕往人眼那个方向为正方向。 transform:translateZ(z) 2.transform-style规定变换的样式(父元素) 属性值:flag平面(默认) preserve-3d保持3d变换 transform-style: preser...原创 2019-05-02 13:31:44 · 247 阅读 · 0 评论 -
HTML常用标签
常用标签 W3C( World Wide Web Consortium )万维网联盟:制定了结构html和表现css的标准 ECMA:制定的行为的标准 1. 文本标题 <h1>一级标题</h1> <h2>二级标题</h2> …… <h6>六级标题</h6> 2. 段落标签 <p>段落文本内容</p> 3...原创 2019-05-02 13:19:25 · 304 阅读 · 0 评论 -
HTML5和CSS3新特性
HTML5和CSS3新特性 文字属性 C3的新特性:渐变与2D转换、3D旋转 弹性盒布局属性原创 2019-05-02 13:14:33 · 916 阅读 · 0 评论 -
CSS基础整理
css基础原创 2019-05-02 13:08:15 · 212 阅读 · 0 评论 -
网格布局学习笔记
网格布局 它将网页划分成一个个网格,可以任意组合不同的网格,做出各种各样的布局。 一、概述 Grid 布局与 Flex 布局有一定的相似性,都可以指定容器内部多个项目的位置。但是,它们也存在重大区别。 Flex 布局是轴线布局,只能指定"项目"针对轴线的位置,可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列",产生单元格,然后指定"项目所在"的单元格,可以看作是二维布局。Grid 布...原创 2019-07-09 21:33:19 · 697 阅读 · 0 评论