2021年3月28日
CSS样式-CSS精灵图，CSS雪碧图
摘要： 原理：当网页需要多张背景的小图时，将多张背景图合并为一张大图，一次请求拉到本地，然后不同元素使用CSS的background-position进行定位。 优点： 减少请求次数，缩短页面加载时间 <!DOCTYPE html> <html lang="en"> <head> <title>Docume 阅读全文
posted @ 2021-03-28 22:50 #Friday 阅读(59) 评论(0) 推荐(0)
CSS样式-文字标题过长的处理
摘要： 一、white-space: nowrap;强制不折行，除非遇到<br>标签 没使用之前的效果： <!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <style type="text/css"> li { list-sty 阅读全文
posted @ 2021-03-28 18:58 #Friday 阅读(311) 评论(0) 推荐(0)
CSS样式-如何消除img下的空白
摘要： 默认情况下，图片是以基线对齐的，也就是下方会留有一条白色的边 <!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <style type="text/css"> div { border: 2px solid #000; } 阅读全文
posted @ 2021-03-28 18:07 #Friday 阅读(246) 评论(0) 推荐(0)
CSS样式-轮廓
摘要： outline： 0 none： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="view 阅读全文
posted @ 2021-03-28 16:03 #Friday 阅读(51) 评论(0) 推荐(0)
CSS样式-鼠标样式
摘要： cursor： default（缺省状态） <!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <style type="text/css"> div { width: 200px; height: 200px; backg 阅读全文
posted @ 2021-03-28 15:26 #Friday 阅读(60) 评论(0) 推荐(0)
CSS样式-溢出
摘要： overflow： visible ：不剪切内容，不出滚动条（缺省） <!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <style type="text/css"> div { width: 200px; height: 阅读全文
posted @ 2021-03-28 14:31 #Friday 阅读(99) 评论(0) 推荐(0)
CSS样式-土豆视频页面.html
摘要： 方式一： <!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <style type="text/css"> .container { width: 212px; height: 318px; position: relat 阅读全文
posted @ 2021-03-28 14:28 #Friday 阅读(360) 评论(0) 推荐(0)