珊迪·奇克斯 - 博客园

2020年8月17日

摘要：解决图片底部默认空白缝隙问题 bug:图片底侧会有一个空白缝隙,原因是行内块元素会和文字的基线对齐。主要解决方法有两种： 1.给图片添加vertical-align:middle |top | bottom等（提倡使用的） 2.把图片转换成块级元素 display:block 阅读全文

posted @ 2020-08-17 23:44 珊迪·奇克斯阅读(115) 评论(0) 推荐(0)

http协议

摘要： http协议就是按照一定的规则，向服务器要数据,或发送数据。而服务器按一定规则回应数据。 HTTP请求信息和响应信息的格式请求：（1）请求行（2）请求头信息（3）请求主体信息请求行又分3部分请求方法请求路径所用的协议请求方法：GET/POST/PUT/DELETE/TRACE/OP 阅读全文

posted @ 2020-08-17 00:01 珊迪·奇克斯阅读(96) 评论(0) 推荐(0)

2020年8月16日

css:vertical-align 属性应用

摘要： css的vertical-align属性使用场景：经常用于设置图片或者表单（行内块元素）和文字垂直对齐。官方解释：用于设置一个元素的垂直对齐方式,但是只针对于行内元素或者行内块元素有效。语法： vertical-align:baseline | top | middle | bottom 值描阅读全文

posted @ 2020-08-16 22:16 珊迪·奇克斯阅读(132) 评论(0) 推荐(0)

css表单轮廓和防止拖拽文本域

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>用户界面样式-表单阅读全文

posted @ 2020-08-16 21:54 珊迪·奇克斯阅读(282) 评论(0) 推荐(0)

css三角

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< 阅读全文

posted @ 2020-08-16 21:38 珊迪·奇克斯阅读(91) 评论(0) 推荐(0)

css三角的制作方法

摘要：网页中常见的三角形,使用css直接画出来就可以,不必做成图片或者字体图标。一张图,你就知道css三角形是怎么来的了。做法如下： div { width: 0; height: 0; line-height: 0; font-size: 0; border: 50px solid transpare 阅读全文

posted @ 2020-08-16 21:20 珊迪·奇克斯阅读(151) 评论(0) 推荐(0)

字体图标的产生

摘要：字体图标使用场景：主要用于显示网页中通用,常用的一些小图标精灵图是有很多优点的,但是缺点很明显 1.图片文件还是比较大的。 2.图片本身放大和缩小会失真 3.一旦图片制作完毕想要更换非常复杂此时，有一种技术的出现很好的解决了以上问题。就是字体图标iconfont. 字体图标可以作为前端工程师提供阅读全文

posted @ 2020-08-16 20:56 珊迪·奇克斯阅读(128) 评论(0) 推荐(0)

2020年8月12日

精灵图二倍图的做法

摘要：在firework里面把精灵图等比例缩放为原来的一半之后根据大小测量坐标注意代码里面的background-size也要写：精灵图原来宽度的一半阅读全文

posted @ 2020-08-12 23:09 珊迪·奇克斯阅读(440) 评论(0) 推荐(0)

2020年8月10日

AJAX教程

摘要： AJAX(Asynchronous JavaScript and XML) (异步的JavaScript和XML)。 AJAX不是新的编程语言,而是一种现有标准的新方法。 AJAX是与服务器交换数据并更新部分页面的艺术,在不重新加载整个页面的情况下。 XMLHttpRequest对象所有现代浏览器阅读全文

posted @ 2020-08-10 16:22 珊迪·奇克斯阅读(187) 评论(0) 推荐(0)

2020年8月9日

移动端常见布局

摘要：流式布局（百分比布局）流式布局,就是百分比布局,也称非固定像素布局。通过盒子的宽度设置成百分比来根据屏幕的宽度来进行延伸,不受固定像素的限制,内容向两侧填充。流式布局方式是移动web开发使用的比较常见的布局方式 <!DOCTYPE html> <html lang="en"> <head> < 阅读全文

posted @ 2020-08-09 22:41 珊迪·奇克斯阅读(203) 评论(0) 推荐(0)

2020年8月8日

css为什么需要精灵图

摘要：一个网页中往往会应用很小的背景图作为修饰,当网页上的图像过多时,服务器就会频繁的接收和发送请求图片,造成服务器请求压力过大,这将大大降低页面的速度。因此为了有效地减少服务器接受和发送请求的次数,提高页面的加载速度,出现了css精灵技术（也称csssprites、css雪碧）精灵图的使用使用精灵阅读全文

posted @ 2020-08-08 01:07 珊迪·奇克斯阅读(367) 评论(0) 推荐(0)

2020年8月7日

元素的显示与隐藏

摘要：类似网站广告,当我们点击关闭就不见了,但是我们重新刷新页面,会重新出现！本质：让一个元素在页面中隐藏或者显示出来。 1.display 显示隐藏 2.visibility 显示隐藏 3.overflow 溢出显示隐藏 display属性 display属性用于设置一个元素应如何显示 display 阅读全文

posted @ 2020-08-07 21:50 珊迪·奇克斯阅读(135) 评论(0) 推荐(0)

css网页布局总结

摘要：通过盒子模型,清楚知道大部分html标签是一个盒子。通过css浮动,定位可以让每个盒子排列成为网页。一个完整的网页,是标准、浮动、定位一起完成布局的,每个都有自己的专门用法。 1.标准流可以让盒子上下排列或者左右排列,垂直的块级盒子显示就用标准流布局。 2.浮动可以多个块级元素一行显示或者左阅读全文

posted @ 2020-08-07 21:31 珊迪·奇克斯阅读(158) 评论(0) 推荐(0)

2020年8月6日

css定位的拓展

摘要：定位的特殊性绝对定位和固定定位也和浮动类似 1.行内元素添加绝对或者固定定位,可以直接设置高度和宽度 2.块级元素添加绝对和固定定位,如果不给宽度或高度,默认大小是内容的大小。 3.脱标的盒子不会触发外边距的塌陷浮动元素,绝对定位(固定定位)元素都不会触发外边距合并的问题。定位的拓展绝对（固阅读全文

posted @ 2020-08-06 22:13 珊迪·奇克斯阅读(108) 评论(0) 推荐(0)

css绝对定位的盒子居中算法

摘要：绝对定位的盒子居中加了绝对定位的盒子不能通过margin:0 auto水平居中,但是可以通过以下方法实现水平居中。 ①left:50%;让盒子的左侧移动到父级元素的水平中心位置 ②margin-left:-100px;让盒子向左移动自身宽度的一半。 <!DOCTYPE html> <html la 阅读全文

posted @ 2020-08-06 19:59 珊迪·奇克斯阅读(568) 评论(0) 推荐(0)

keep

公告