随笔分类 -  html/css

更改网站图标
摘要：###以下方法将图标更改为 URL： const setFavicon = (url) => { // 找到当前的图标元素 const favicon = document.querySelector('link[rel="icon"]') if (favicon) { // 更新新链接 favic 阅读全文
posted @ 2022-11-03 17:29 Tommy_marc 阅读(152) 评论(0) 推荐(0)
图片下载到本地，图片保存到本地
摘要：必须同源（访问的网站域名与服务器域名一致）才能下载 downs() { var alink = document.createElement("a"); alink.href = this.shop.shoppic_url; alink.download = "pic"; //图片名 alink.c 阅读全文
posted @ 2021-06-16 15:43 Tommy_marc 阅读(222) 评论(0) 推荐(0)
css3 object-fit详解
摘要：上传头像的时候遇到了头像变形的问题，最后通过object-fit: cover完美解决了。这个CSS属性可以达到最佳最完美的居中自动剪裁图片的功能。 object-fit理解 CSS3 background-size出现的比较早，大家应该知道其支持的一些值，除了数值之外，其还支持几个关键字，例如：c 阅读全文
posted @ 2020-06-10 11:57 Tommy_marc 阅读(477) 评论(0) 推荐(0)
js倒计时|天时分秒| countTime
摘要：js倒计时|天时分秒| countTime <!DOCTYPE html> <html lang="en"> <head> <title>倒计时</title> </head> <body> <script type="text/javascript"> const endTimeObj = new 阅读全文
posted @ 2020-05-19 09:08 Tommy_marc 阅读(1108) 评论(0) 推荐(0)
css应用视觉设计
摘要：应用视觉设计：创建一个 CSS 线性渐变 HTML元素的背景色并不局限于单色。css还提供了颜色过渡，也就是渐变。可以通过background里面的linear-gradient()来实现线性渐变，下面是它的语法： background:linear-gradient(gradient_direct 阅读全文
posted @ 2019-12-20 23:04 Tommy_marc 阅读(604) 评论(1) 推荐(0)
flex盒子布局
摘要：Flex布局语法教程 网页布局(layout)是css的一个重点应用 布局的传统解决方案：基于盒状模型，依赖display+position+float属性。它对于那些特殊布局非常不便，比如，垂直剧中就不易实现 //传统解决垂直居中 <div class = "content"></div> <st 阅读全文
posted @ 2019-12-14 22:30 Tommy_marc 阅读(486) 评论(0) 推荐(0)
flex布局实例demo全解
摘要：上篇文章介绍了Flex布局的语法，今天介绍常见布局的Flex写法。 你会看到，不管是什么布局，Flex往往都可以几行命令搞定。 我只列出代码，详细的语法解释请查阅《Flex布局教程：语法篇》。我的主要参考资料是Landon Schropp的文章和Solved by Flexbox。 一、骰子的布局 阅读全文
posted @ 2019-10-06 16:16 Tommy_marc 阅读(1170) 评论(0) 推荐(1)
Sass和less的区别是什么？用哪个好
摘要：什么是Sass和Less？ Sass和Less都属于CSS预处理器，那什么是 CSS 预处理器呢？ CSS 预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行CSS的编码工作。 转化成通俗易 阅读全文
posted @ 2019-10-06 16:15 Tommy_marc 阅读(20859) 评论(0) 推荐(0)
微信引导分享页面 及 素材
摘要：html： 其实html上可以随意写 只要指定一个 点击地方的id是share_btn css： js： 素材（图片上传会有水印 所以压缩上传）： http://ask.mykeji.net/content/uploadfile/201906/75ba1560132865.zip 阅读全文
posted @ 2019-10-06 15:11 Tommy_marc 阅读(881) 评论(0) 推荐(0)
安卓和IOS、微信 公用一个二维码
摘要：放到服务器上获取这个页面的链接 生成二维码即可 阅读全文
posted @ 2019-10-06 15:05 Tommy_marc 阅读(543) 评论(0) 推荐(0)
【pdf】XHTML——CSS笔记整理
摘要：http://ask.mykeji.net/read/xhtml-css_day01-day06.html 阅读全文
posted @ 2019-10-06 14:31 Tommy_marc 阅读(125) 评论(0) 推荐(0)
【pdf】XHTML&CSS
摘要：http://ask.mykeji.net/read/pdf_xhtml-css.html 阅读全文
posted @ 2019-10-06 14:28 Tommy_marc 阅读(107) 评论(0) 推荐(0)
【day05】css
摘要：一.盒模型(BoxModel) 1.width 宽度 2.height 高度 说明: 块元素和有宽高属性的标记(img,input) ，能设置宽度和高度，而行元素不能设置宽高 3.padding ：内边距,内容到边框的距离 padding-top: 上内边距 padding-right: 右内边距 阅读全文
posted @ 2019-10-06 14:21 Tommy_marc 阅读(118) 评论(0) 推荐(0)
【day06】css
摘要：一.背景(Background) 1. background-color 背景颜色 2. background-image:url(图像URL);背景图片 3. background-repeat: 背景重复 repeat默认值|repeat-x水平重复| repeat-y垂直重复|no-repea 阅读全文
posted @ 2019-10-06 14:21 Tommy_marc 阅读(100) 评论(0) 推荐(0)
【day04】css
摘要：一. CSS2.0[Cascading Style Sheets]层叠样式表 1. 什么是CSS:修饰网页元素(标记)外观(比如给文字加颜色，大小，字体)的，W3C规定尽量用CSS样式替代XHTML属性 2. XHTML和CSS的关系 XHTML实现是网页结构，CSS修饰网页外观 3. CSS的使用 阅读全文
posted @ 2019-10-06 14:20 Tommy_marc 阅读(131) 评论(0) 推荐(0)
【day03】Xhtml
摘要：一.HTML公共属性 1. title 提示 2. class 3. id 4. style 说明:除了 html,head,body,link,meta外其他标记都可使用的属性 二.表单 1.表单的作用:收集客户端的信息，然后发送到服务器上。 2.表单格式 <form action="服务器的UR 阅读全文
posted @ 2019-10-06 14:12 Tommy_marc 阅读(150) 评论(0) 推荐(0)
【day02】Xhtml
摘要：一.HTML实体(HTML Entites) 1.HTML实体：W3C规定在浏览器看到的特殊符号必须用HTML实体 单引号(') &#39; 双引号(") &quot; 大于(>) &gt; 小于(<) &lt; 连接符(&) &amp; 不间断空格 &nbsp; 版权 &copy; 商标 &reg 阅读全文
posted @ 2019-10-06 14:02 Tommy_marc 阅读(266) 评论(0) 推荐(0)