初始-前端

程序媛—QY

已于 2023-08-01 16:47:04 修改

阅读量45

点赞数

分类专栏：前端文章标签：前端状态模式

于 2023-08-01 16:35:36 首次发布

本文链接：https://blog.csdn.net/QYcgln/article/details/132045553

版权

前端专栏收录该内容

7 篇文章 0 订阅

订阅专栏

初识前端

一.HTML

HTML超文本标记语言

基于word还有一些图片，链接，音频等。

<>< />双目标签

<>单目标签

基本格式

<!--版本声明是HTML语言-->
<!DOCTYPE html>

<!--html标签包裹网站所有信息 -->
<html lang="en"> 
    
<!--head标签包裹一些用户看不见的信息-->
<head>
    
    <!--meta 编码方式-->
    <meta charset="UTF-8">
    
    <link rel="icon" type="image/f">
    <!--title标签定义网站标题-->
    <title>Document</title>
    <!-- style定义网页css样式 -->
    <style ></style>
    
</head>
<!--body标签-->
<body>
</body>

</html>

基础标签

标签	备注
<p></p>	段落
<h1></h1>–<h6></h6>	标题
<b></b> <strong></strong>	加粗
<i></i> <em></em>	倾斜
<sub></sub> \ ^</sup>	上下标
<del></del>	删除线
<ins></ins>	下划线
<mark></mark>	高亮
<span></span>	文本
<hr />	分割线
<br />	换行
<abbr>	缩写

基本属性

解释	属性	选择	备注
内联框架	style


宽度	width	像素
高度	height	像素
长度	size
颜色	color	颜色

决定了标签是块级，行级，行内块	display	inline	块级标签
		block	行级标签
		inline-block	行内块标签

定义背景属性	backgroud	color	颜色
		image	图片

常用标签及属性

标签	属性	备注
图片	src	图片路径
	alt	图片加载不出来展示

链接	href	链接地址，内部链接，照片，js代码，锚点等
	target	新的页面打开

滚动	direction	滚动方向
	behavior	滚动方式
	scrollamount	滚动速度
	scroldelay	滚动时间

盒子		块级标签

音频	controls	控制器
视频	controls	控制器

表示用户界面中某个元素的说明。	for	和一个元素相关联

表单输入元素	type:“text”	文本
	:“password”	密码
	:“radio”	单选组
	:“checkbox”	多选
	:“button”	点击
	:“submit”	提交
	:“range”	点击拖拽

点击按钮

路径 ./ 表示同级目录

…/ 表示上一级目录

表

列表

有序

	<!-- start从10开始倒  reversed倒序 -->		
	<ol type ="1" start="10" reversed>
     	<li></li>
        <li></li>
	</ol>

无序

	<!-- circle实心圆 disc空心圆 square实心方块 -->
	<ul type ="circie">
     	<li></li>
        <li></li>
	</ul>

自定义

	<dl>
     	<dt></dt>
            <dd></dd>
            <dd></dd>
	</dl>

表格

	<table>
        <caption>表 标题</caption>
        <tr>
            <th c>姓名</th> <!--表头  colspan 列合并 rowpan横合并-->
            <td>张三</td><!--内容-->
        </tr>
         <tr>
            <td>linxiren</td>
        </tr>
	</table>

表单

	<from>
        <fieldset><!-- <fieldset>  表单的边框线 -->
            <legend></legend><!--<legend>-->
            <abel for="user">用户名</abel><input id="user" >
        <select>
            <option>下拉框1</option>
            <option>下拉框2</option>
            <option>下拉框3</option>
        </select>
        
        <textarea></textarea>/* 文本域 */
        </fieldset>
	</from>

下拉框

	<select name="" id="">
		<option value="">山西省</option>
		<option value="">湖南省</option>
		<option value="">广东省</option>
		<option value="">辽宁省</option>
		<option value="">浙江省</option>
	</select>

转义字符

转义字符	备注
	空格

框架

整合框架

不能放在body里

	<frameset><!-- 整合框架 cols 左右屏 rows上下屏 -->
    	<frame></frame><!-- 几个框创几个 -->    
		<frame></frame>    
	</frameset>

内联框架

<iframe src="地址"   name="接收"></iframe>

程序媛—QY

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
1
评论
初始-前端

HTML超文本标记语言基于word还有一些图片，链接，音频等。< />双目标签单目标签。
复制链接

扫一扫

专栏目录