- 博客(18)
- 收藏
- 关注
RSS订阅原创 2D转换及动画
转换transform可以实现移动、旋转、放缩效果的特征移动translate移动类似于定位，可以改变元素在页面中的位置。语法：transform:translate(x,y);/*也可分开写*/transform:translateX(n);transform:translateY(n);特点：定义2D转换中的移动，沿着X、Y轴移动元素translate不会影响其他元素的位置translate中的百分比单位是相对于元素自身的translate对行内标签无效果旋转rotat
2020-07-27 20:59:44
174
原创 CSS3选择器
类选择器、属性选择器、伪类选择器的权重均为10属性选择器选择符及简介/*属性选择器使用方法*/button[disabled]{ cursor:defaule;}结构伪类选择器e：first-child：匹配父元素中的第一个子元素ee：last-child：匹配父元素中最后一个e元素e：nth-child（n）：匹配父元素中的第n个子元素ee：first-of-type：指定类型e的第一个元素e：last-of-type：指定类型e的最后一个类型e：nth-of-ftype（n
2020-07-27 12:41:45
86
原创 HTML5标签
新增语言化标签:头部标签：导航：内容标签：块级标签：侧边栏标签：尾部标签音频标签音频格式元素支持的三种音频格式：Ogg vorbis/MP3/Wav语法：<audio scr"音频地址" > </audio>常见属性：autoplay：如果出现该属性，音频就绪后马上播放controls：出现该属性则向用户显示控件，如播放按钮loop：出现该属性则音频结束时重新播放，即循环播放src url：表示要播放的音频的url/*不同
2020-07-27 12:00:27
119
原创 元素模式
块级元素元素排列: 一行只能放一个块级元素。设置样式: 可以设置宽度高度。默认宽度: 容器的100%包含: 容器级可以包含任何标签。常用的块级元素：div,dl,dt,dd,ol,ul,fieldset,（h1-h6）,p,form,hr,colgroup,col,table,tr,td等。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>.
2020-07-24 22:38:00
202
原创 外观属性
文本颜色（color）作用：color属性用于定义文本的颜色。取值方式如下：表示方式属性值预定义颜色值red、blue、black等十六进制#FF0000、#FF6600等RGB代码rgb(255,0,0)或rgb(100%,0%,0%) .b { color:red; /*预定义颜色值 */ } .c{ color: #FF6600; /*用十六进制定义文本颜色*/ .
2020-07-24 22:37:44
133
1
原创 背景总结
background-color作用: 背景颜色值: 预定义的颜色/十六进制/RGB代码语法：background-color：颜色值；background-image作用: 背景图片值: url(路径)语法：background-image：url（）或background-image：nonebackground-image：url（image/png); /*使用绝对或相对地址来指定背景图*/background-image：none /.
2020-07-24 14:24:04
70
原创 引入CSS样式表
CSS样式书写规则:此图像的alt属性为空；文件名为20200118182452419.png三种引入CSS样式表:行内式（内联样式）（使用较少）优点: 书写方便，权重高缺点: 没有实现样式与结构分离控制范围: 一个标签HTML 行内样式表 行内样式表 #直接在标签内引用EnlighterJS Syntax Highlighter内部样式表（内嵌样式表）（使用较多）优点: 部分结构与样式分离缺点: 没有彻底分离控制范围：一个页面HTML!DOCTYPE h
2020-07-24 14:16:45
103
原创 css三大特性
css三大特性：层叠性、继承性、优先级层叠性层叠性是指多种css样式的叠加。原则：若样式冲突，遵循就近原则。即哪个样式离结构进就执行哪个。若样式不冲突不会叠加。继承性优点：可以简化代码，降低css样式的复杂性子元素可以继承父元素的样式： 以text-，font-，line-这些元素开头的以及color属性。优先级不同选择器的执行级别不同通配符选择器或继承：权重为0标签选择器：权重为1类选择器或伪类：权重为10id选择器：权重为1.
2020-07-24 14:13:48
76
原创 浮动
css布局的三种机制标准流：块级元素独占一行，从上至下顺序排列。行内元素按照顺序从左至右排列。浮动：让盒子从标准流中浮起来。定位：将盒子定在浏览器的某一位置。浮动概念：脱离标准流格式的控制，让块级元素可以在同一行显示。作用：让多个盒子水平排成一列；使盒子左右对齐等。特点：加了浮动的盒子可以漂浮在其他标准流盒子上面加了浮动的盒子不占位置，即原来的位置留给了标准流的盒子浮动元素会生成一个块级框，与行内块模式十分相似浮动的应用浮动和标准流的父盒子搭配一个完整的页面是由标准流、浮动、定位一
2020-07-24 14:01:31
64
原创 关于页面制作
css属性书写顺序布局定位属性：display/position/float/clear/visibility/overflow自身属性：width/height/margin/padding/border/background文本属性：color/font/text-decoration/text-align其他属性：content/cursor/box-shadow/text-shadow/background布局流程确定页面的版心分析页面中的版块布局，分为行模块和列模块写HTML结构，
2020-07-24 13:57:59
89
原创 定位
定位=定位模式+边偏移边偏移边偏移要和定位模式联合使用，单独使用无效。边偏移属性 含义top 元素相对于其父元素上边的距离bottom 元素相对于其父元素底边的距离left 元素相对于其父元素左边线的距离right 元素相对于其父元素右边线的距离定位的分类静态定位静态定位是元素默认定位方式，即无定位，当不需要定位的时候引用。静态定位按照标准流特性摆放，没有边偏移。相对定位relative相对定位是元素相对于原先在标准流的位置来说的。HTMLposition：relative
2020-07-24 13:56:42
105
原创 基础选择器
标签选择器 (使用较多)作用: 选出所有相同的标签优点：能快速将页面中同类型的标签改为统一样式缺点: 无法差异化选择HTML!DOCTYPE html> 标签选择器 通配符选择器1 通配符选择器2 通配符选择器3EnlighterJS Syntax Highlighter...
2020-07-24 13:53:30
91
原创 font总结
font-size表示: 字号。注意点: 单位是px像素，一定跟上单位。HTML font-size font-sizeEnlighterJS Syntax Highlighterfont-family表示: 字体。注意点: 实际工作中按照团队约定来写字体。技巧：可以同时指定多个字体，中间用逗号隔开，该方式表示如果浏览器不支持第一个字体则直接尝试下一个，选出合适的字体。（尽量使用系统默认字体）HTML font-family font-fam
2020-07-24 13:51:32
92
原创 盒子模型
边框（border）边框颜色: border-color边框宽度: border-width边框样式: border-style相邻边框合并: border-collapse: collapse连写: border: 宽度 样式 颜色ex: border: 1px solid red;边框样式：none：无边框solid：边框为实线（最常用）dashed：边框为虚线dotted：边框为癫痫边距内边距（padding）四个单独的属性，分别设置上、右、下、左内边距：padding-
2020-07-24 13:48:24
72
原创 表格、列表及表单
表格表格创建<table> #table用于定义一个表格标签 <tr> #tr用于定义表格中的行，必须嵌套在 table标签中 <td>单元格内的文字</td> ... # td用于定义表格中的单元格，必须嵌套在<tr></tr>标签中 </tr></table>表格属性<table bo.
2020-07-24 13:45:40
276
原创 HTML骨架及标签
HTML骨架HTML 标题 页面内容EnlighterJS Syntax HighlighterHTML双标签的两种关系1.嵌套关系HTML<–title嵌套在head中–> EnlighterJS Syntax Highlighter2.并列关系HTMLEnlighterJS Syntax Highlighter标题标签HTML标题文本1标题文本2标题文本3...EnlighterJS Syntax High
2020-07-23 19:41:18
259
原创 复合选择器总结
后代选择器 （使用较多）作用: 用来选择元素后代特征: 是选择所有的子孙后代HTML 后代选择器 后代选择器 后代选择器EnlighterJS Syntax Highlighter子代选择器 （使用较少）作用: 选择最近一级元素特征: 只选亲一级HTML 子代选择器 子代选择器1 子代选择器2 子代选择器3 子代选择器1 子代选择器2 子代选择器3 EnlighterJS
2020-07-23 19:38:46
172
原创 css部分技巧
元素的显示与隐藏目的：让一个元素在页面中显示出来或消失display显示display设置或检索对象是否及如何显示display：none 隐藏对象 display：block 除了转换为块级元素之外，同时还表示显示元素特点：元素隐藏之后不再保留位置。用途：配合js做特效，如下拉菜单等visibility显示用于设置或检索是否显示对象visibility：visible； /*对象可视*/visibility：hidden； /*对象不可视*/特点：隐藏之后，元素位置继续保留。ov
2020-07-23 19:37:37
79
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人