xxcf ciming

## URL转换.js
//生成URL
const searchParams = new URLSearchParams();
searchParams.set('foo', 'bar');
searchParams.set('hello', 'world');

const searchParams = new URLSearchParams([
  ['foo', 'bar'],
  ['hello', 'world'],
]);

## 边框旋转特效.html
<div class="rainbow">
  <p>This demo uses a real border with <code>border-image</code>, a background, and finally Houdini to animate.</p>
</div>

<div class="warning">
  <p>⚠️ Your browser does not support <a href="https://web.dev/css-individual-transform-properties/">@property</a> so the animation won’t work<br />Please use Chrome.</p>
</div>

<style>
:root {

## 自定义web组件.js
// 基本
class PonyComponent extends HTMLElement {
  constructor() {
    super();
    console.log("I'm a pony");
  }
  connectedCallback() {
    this.innerHTML = '<h1>General Sola</h1>';
  }
}

## get-video-size.html
<html>
  <head>
<style>
div {
    margin: 20px;
}
</style>
  </head>
  <body>
    <h1>Get Dimensions</h1>
	//生成URL
	const searchParams = new URLSearchParams();
	searchParams.set('foo', 'bar');
	searchParams.set('hello', 'world');

	const searchParams = new URLSearchParams([
	['foo', 'bar'],
	['hello', 'world'],
	]);
	<div class="rainbow">
	<p>This demo uses a real border with <code>border-image</code>, a background, and finally Houdini to animate.</p>
	</div>

	<div class="warning">
	<p>⚠️ Your browser does not support <a href="https://web.dev/css-individual-transform-properties/">@property</a> so the animation won’t work<br />Please use Chrome.</p>
	</div>

	<style>
	:root {
	// 基本
	class PonyComponent extends HTMLElement {
	constructor() {
	super();
	console.log("I'm a pony");
	}
	connectedCallback() {
	this.innerHTML = '<h1>General Sola</h1>';
	}
	}
	<html>
	<head>
	<style>
	div {
	margin: 20px;
	}
	</style>
	</head>
	<body>
	<h1>Get Dimensions</h1>