HTML、CSS、JavaScript常用标签、语法和用法-[:ug]Waris[:zh]Waris[:]

下面整理了常见的HTML、CSS、JavaScript常用标签、语法和用法，帮助大家更好的理解和使用它们

HTML（超文本标记语言）

常见HTML标签

标签	功能	示例
<html>	定义HTML文档的开始和结束	<html>……</html>
<head>	定义文档的头部部分	<head>……</head>
<title>	定义文档标题	<title>welcome my website</title>
<body>	定义文档的主体部分	<body>Content goes here</body>
<h1>-<h6>	定义标题（<h1>为最大，<h6>为最小）	<h1>title</h1>
<p>	定义段落	<p>this is a paragraph.</p>
<a>	定义超链接	<a href=”https://www.waric.cn”Link</a>
<img>	定义图像	<img src=”image.jpg”alt=”image”>
<ul>	定义无序列表	<ul><li>Item 1</li<li>Item 2</li></ul>
<ol>	定义有序列表	<ol><li>First</li<li>Second</li></ol>
<li>	定义列表项	<li>Item</li>
<div>	定义区块级元素	<div class=”container”>Content</div>
<span>	定义行内元素	<sapn class=”highlight”>Text</sapn>
<form>	定义表单	<form action=”/submit”><input type=”text”/></form>
<input>	定义输入控件	<input type=”text”/>
<button>	定义按钮	<button>Click Me </button>
<table>	定义表格	<table><tr><td>Row 1</td></tr></table>
<tr>	定义表格行	<tr><td>Row 1</td></tr>
<td>	定义表格单元格	<td>Content</td>

HTML 属性

href:用于<a>标签，指定超链接的目标。

<a href="https://www.waric.cn">Waris资源库</a>

src: 用于标签，指定图像源文件。

< img src="image.jpg" alt="A sample image" />

class: 用于为元素指定类名。

<div class="container">Content here</div>

id: 用于为元素指定唯一的标识符。

<h1 id="main-heading">Welcome</h1>

style: 内联样式，用于为元素指定CSS样式。

<p style="color:red;">This text is red.</p >

CSS（层叠样式表）
常见 CSS 语法
CSS 用于定义 HTML 元素的样式。其基本语法格式为：

selector {
    property: value;
}

常见 CSS 选择器

选择器	描述	示例
*	通配符选择器，选择所有元素	* {color:red; }
#id	选择具有指定id的元素	#main { font-size:20px; }
.class	选择具有指定class的元素	.button { background-color:blue; }
element	选择指定类型的元素	p { margin:10px; }
element1,element2	选择多个元素	h1,h2 { color: green; }
element > element	选择指定元素的直接子元素	ul>li { list-style-type:square; }

常见的CSS属性

属性	功能	示例
color	设置文本颜色	color: red;
font-size	设置字体大小	font-size: 10px;
background-color	设置背景颜色	background-color: #f0f0f0;
margin	设置外边距（元素与元素之间的间距）	margin: 10px;
padding	设置内边距（元素与内容之间的间距）	padding: 15px;
width	设置元素宽度	width: 200px;
height	设置元素高度	height: 100px;
border	设置元素边框	border: 1px solid black;
display	设置元素显示类型（如block, inline）	display: block;
text-align	设置文本对齐方式	text-align: center;

此页面长期更新！！！

本站致力于为软件爱好者提供国内外软件开发技术和软件共享，着力为用户提供优资资源。本站提供的所有下载文件均为网络共享资源，请于下载后的24小时内删除。如需体验更多乐趣，还请支持正版。我站提供用户下载的所有内容均转自互联网，如有内容侵犯您的版权或其他利益的，请编辑邮件并加以说明发送到站长邮箱，站长会进行审查之后，情况属实的会在三个工作日内为您删除。邮箱：2359736355@qq.com

THE END