- 博客(41)
- 问答 (7)
- 收藏
- 关注
RSS订阅原创 移动Web之响应式布局
布局特点：响应式布局指的是同一页面在不同屏幕尺寸下有不同的布局需要一个布局容器，结合css的多媒体查询在不同的设备宽度下，一定会产生不同的显示样式。某些元素会隐藏或显示，某些元素会从行内元素变成块状元素传统的开发方式是PC端开发一套，手机端再开发一套，响应式布局相较于传统开发方式优点是只要开发一套就够，缺点就是CSS文件代码量大 <!DOCTYPE html>...
2019-12-29 21:22:19
554
原创 移动Web之rem布局
rem布局思想： ① 我们希望网页的宽高、文字等各元素在不同大小的屏幕上同时进行等比例缩放，达到适配移动端多种尺寸屏幕的最好效果 ② 在移动web页面中，由于理想视口的存在且如①所述，故设网页设计宽度（屏幕宽...
2019-12-29 21:06:51
313
原创 移动Web之flex布局
Flex布局：Flex布局又叫伸缩布局、弹性布局、伸缩盒布局、弹性盒布局、flex布局给父盒子添加flex属性，来控制子盒子的位置排列方式从而实现flex布局当我们为父盒子设为flex布局以后，子元素的float、clear和vertical-align属性将失效 Flex布局与传统布局和流式布局相比传统布局：兼容性好，布局繁琐，局限性在移动端不能很好布局Flex布局...
2019-12-29 20:49:09
224
原创 移动Web之流式布局
布局思想：流式布局，也称百分比布局设置根元素居中，内容向两侧填充通过根容器的宽度设置成百分比来根据屏幕的宽度来进行伸缩，不受固定像素的限制为了保护内容在合理的范围内在页面中通常限制 max-width 最大宽 min-width 最小宽 <!DOCTYPE html><html lang="zh"><head> <me...
2019-12-29 20:37:06
230
原创 CSS3之flex属性
flex属性特点：要在容器中定义flex属性需要在flex容器上使用display:flex属性在flex容器内部没有行内、行内块、块级元素的概念，所有元素皆可设置宽高在flex容器内部拥有主、侧轴（内容排列主方向，辅方向）主要应用于移动端页面或者不考虑兼容的PC端页面 flex容器属性：flex-direction:作用： &n...
2019-12-22 16:44:45
400
原创 CSS3之User-Interface属性
box-sizing:作用： 设置盒子尺寸的定义标准，可以以内容区为准，也可以以border为准说明： 可令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中常用值：...
2019-12-19 22:17:45
287
原创 CSS3之transform属性-3D转换
三维坐标系x 轴：水平向右 – 注意：x轴右边是正值，左边是负值y 轴：垂直向下 – 注意：y轴下面是正值，上面是负值z 轴：垂直屏幕 – 注意：z轴往外是正值，往里是负值 3D旋转左手准则左手的手拇指指向旋转轴的正方向其余手指的弯曲方向就是该元素沿着该旋转轴旋转的方向（正值方向） transform:作用：  ...
2019-12-18 21:56:02
1536
1
原创 CSS3之transform属性-2D转换
transform:作用： 该属性可以将元素旋转、缩放、移动、倾斜等说明： 应用于元素的2D或3D转换常用值： &nb...
2019-12-18 21:14:57
693
原创 CSS3之animation属性
@keyframes:作用： 定义一个动画，@keyframes定义的动画名称用来被animation-name所使用说明： 动画是通过逐步改变CSS样式的节点来实现的。在一个完整...
2019-12-18 20:56:46
1068
原创 CSS3之transition属性
transition:作用： 设置元素当过渡效果，也就是控制元素从一种样式转化到另一种样式的时间、速度变化曲线等属性说明： 如果该属性持续时间为 0，transition不会有任何...
2019-12-16 22:37:24
361
2
转载 CSS3之解决相邻inline-block元素之间空白间隙问题
一、遇到的问题 前些天写瀑布流布局的时候，发现明明计算好了宽度使得一行能放下三张图片，实际效果却总是放不下，图片会挤到下一行去。上图：可以看到，我本来是想要两行图片，每一行是三张。结果现在第一行的图片跑到第二行去了。代码结构很简单：<li> <a></a> &...
2019-12-09 15:50:31
893
原创 CSS3之解决相邻border重合加粗问题
解决这个问题的 方法 是 ：在 该元素 上设置 相关方向 的 margin为-1px;如果需要 伪类显示 的话，在 该元素的伪类 中加 相对定位，目的是将 被压住 的 border 显示出来如果 还需要 在 此元素 上加 拥有绝对定位的其它元素，那么在 该元素 上加 相对定位，在 该元素的伪类 上加 z-index 属性 下面两个例子就是利用了这个方法！！！代码示例...
2019-11-06 22:39:01
8147
原创 CSS3之定位及其用法
在CSS中，有 标准流、浮动、定位 三种方式来为网页的布局提供支持 标准流： 它的使用最为普遍，他们根据自身的特性 （行内、块级、行内块） 各自占有网页中的一部分空间。 浮动： 它脱离了标准文档流，它的目的就是将多个块级元素并排放...
2019-11-04 22:10:26
495
原创 HTML开发神器-Emmet学习
Emmet简介： 通常大多数的文本编辑器都会允许我们存储和重用一些代码块，我们称之为 “片段或代码模板”。虽然片段能很好地推动我们的生产力，但大多数的实现都有这样一个缺点：我们必须先定义代码片段，并且不能再运行时进行拓展。而Emmet把片段这个概念提高到了一个新的层次：我们可以设置CSS形式的能够动态被解析的表达...
2019-10-31 21:13:53
390
转载 CSS3书写规范及顺序
使用良好的CSS书写规范来写CSS代码，可以提升代码的阅读体验，这里设计达人网总结一个CSS书写规范、CSS书写顺序供大家参考 ： CSS书写顺序：位置属性(position, top, right, z-index, display, float等)大小(width, height, padding, margin)文字系列(font, line-height, lette...
2019-10-28 21:35:12
659
原创 CSS3之浮动及其清除
在网页布局中，我们经常要将多个块级元素无间距地排列到一排，从而进行网页布局，而由于块级元素的特性，在一般情况下这种效果不容易实现！因此就要利用浮动特性！！！ 网页布局的三种机制标准文档流： 在不使用float属性...
2019-10-27 21:07:33
397
原创 CSS3之盒子模型及其特性
盒子模型在CSS中很重要，它是网页布局的基础！！！先上一个Chrome开发者工具中的盒子模型：由此模型可以看出完整的盒子模型包含以下几部分： 1.content区域：上图中蓝色背景的部分，此部分主要用于盛放具体内容，可能是文本、其他块级元素等 &...
2019-10-26 22:35:59
1343
原创 CSS3之background属性
background:作用： 在一个声明中设置所有的背景属性说明： 可以设置的属性分别是：background-color, background-posi...
2019-10-24 21:40:26
1192
1
原创 CSS3之color属性
opacity:作用：设置一个元素的透明度级别说明：此透明与rgba()不同，opacity作用于元素，以及元素内的所有内容的透明度，而rgba()只作用于元素的颜色或其背景，与子元素及里面的内容无关常用值：(0 ~ 1)： 从0.0 （完全透明） 到 1.0 （完全不透明） 代码示例：<!DOCTYPE html><html lang="zh"&g...
2019-10-24 10:05:07
519
原创 CSS3之border属性
border相关属性需要大量练习，方可运用自如！文字下方有Demo！！！border:作用： 设置在一个声明中 包含 所有 的边框 属性说明： 可...
2019-10-24 10:04:26
2123
原创 CSS3之list属性
list-style:作用： 在一个声明中设置所有的列表属性。说明： 按顺序写入各属性：list-style-type, list-style-positi...
2019-10-24 10:02:55
486
原创 CSS3之table属性
border-collapse:作用： 设置表格的边框是否被合并为一个单一的边框说明： border-collapse属性，如果没有指定 !DOCTYPE...
2019-10-24 10:01:41
684
原创 CSS3之text属性
color:作用： 指定文本的颜色说明： 该属性在块、行内、行内块的样式表中都可以使用，改变被控制元素内部所有文本的颜色关于颜色值的四种写法： ...
2019-10-24 10:00:27
1022
原创 CSS3之font属性
font：作用： 在一个声明中设置所有字体属性说明： 可设置的属性是（按顺序）： “font-style font-weight font-size/lin...
2019-10-24 09:59:27
1026
原创 CSS3之常用选择器
基础选择器标签选择器：作用： 该选择器作用于一种标签 （相同标签名），用于描述一种标签的共有样式用法： 选择器直接写标签名 element...
2019-10-20 22:03:40
167
原创 HTML5之事件属性
键盘事件属性描述onkeyup当松开按键时运行脚本onkeydown当按下按键时运行脚本 鼠标事件属性描述onclick当单击鼠标时运行脚本ondbclick当双击鼠标时运行脚本onmouseover当鼠标指针移至元素之上时运行脚本onmousemove当鼠标指针移动时运行脚本onmouseou...
2019-10-19 01:09:43
208
原创 HTML5之相关知识
一、 认识网页 网页是构成网站的基本元素，是承载各种网站应用的平台。通俗地说，您的网站就是由网页组成的，如果您只有域名和虚拟主机而没有制作任何网页的话，您的客户仍旧无法访问您的网站。 网页是一个包含HTML标签的纯文本文件，它可以存...
2019-10-18 23:31:37
354
原创 HTML5之音/视频标签
<audio>标签常用属性： [src]： 要播放的音频的URL [controls]： 如果出现该属性则向用户显示控件 （播放按钮、暂停按钮等）...
2019-10-18 21:09:22
527
原创 HTML5之图像标签
<img>标签常用属性： [src]： 规定显示图像的URL [alt]： 规定图像的替代文本，当图像显示出现问题时，文字会出现替代图像&nbs...
2019-10-18 21:06:37
2353
2
原创 HTML5之链接标签
<a>标签常用属性： [href]： 最重要的属性，它指定链接的目标。没有使用 href 属性，则不能使用 hreflang、media、rel、target 以及 type 属性 ...
2019-10-18 17:05:25
563
原创 HTML5之框架标签
<iframe>标签常用属性： [src]： 规定在中显示的文档的URL （默认首页） [srcdoc]： 定义HTML内容显示在 <ifr...
2019-10-18 16:08:07
1246
原创 HTML5之表单标签
<form>标签常用属性： [name]： 规定表单的名称 [action]： 规定当提交表单时向何处发送表单数据 &nb...
2019-10-18 14:22:52
655
原创 HTML5之样式/节标签
<header>标签类别： 容器级标签作用： 用来定义网页或任意Section以及article中的页眉说明： &nb...
2019-10-17 23:59:50
945
空空如也
sass 命令行使用
2021-04-11
同样的操作，为什么在表达式在方法溜达一圈，结果却不同
2020-11-06
经过s = s + "bbb";这句话以后s的引用地址为什么没变？
2020-11-05
java 请问以下三个算式为什么会出现下面的结果，请逐一解答，谢谢！！！
2020-07-24
Idea部署struts2项目，struts.xml无法读取jap文件路径？
2019-04-17
TA创建的收藏夹 TA关注的收藏夹
TA关注的人