IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 【HTML、-HX学习】网页前端学习笔记(一) -> 正文阅读

[JavaScript知识库]【HTML、-HX学习】网页前端学习笔记(一)


一、软件的下载

1,HX的特点:vue开发强化,小程序支持,markdown利器,强大的语法提示,高效极客工具,更强的json支持。

2,文件来自学长的压缩包,在众多Markdown源文件里面找到了两个应用程序,直接打开,很行。


二、视频学习--HTML概述和常用标签

》》》??????视频在这里!

HTML为基础,CSS、JS类似于扩展

1.超文本标记语言

2.基础语法<>单标签,双标签,有无属性

单标签无属性 <br/>换行 <hr/>分割线

单标签有属性 <hr width="800" />

双标签无属性 <title>_</title>

双标签有属性 <body bgcolor="red">_</body>

3.整体结构

标记头区? title,内容区? body,网页区? html

?

title---是主要提示,标签

link---用来引入css

scrip---用来引入js文件或编写js代码

4.常用标签

(1)标题和水平线

<h1></h1>///1~6

h元素---拥有确切的语义,叠层样式表定义可以有漂亮的效果,但是/h1标签可以为搜索引擎获取,便于检索,h1过多可能进入搜索引擎黑名单

块级元素,可以自动换行

(2)段落和换行

<hr />

默认屏幕等宽

color,颜色

size,粗细

width,宽度,百分比,像素px

align,对齐方式

(3)列表

无序列表<ul?type="square"></ul>? ?---circle(实心点,默认)---disc(空心点)? ?---square(方块)

有序列表<ol type="1">---1.内容

(4)div和span

div(层)---是万能的标签,可替换任意,结合css,页面排版,块,默认一整行

<div style="width:100px;height:100px;"align="center"></div>---center居中

span---标签,行内元素(不会自动换行)

(5)格式化标签

font---规定文本的字样、字体尺寸、字体颜色 face,size,color

pre---定义预格式化的文本,被包含在pre元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体

&nbsp; ---空格符

b---加粗

i---倾斜

u---下划线

del---中划线

sup---上标,平方

sup---下标,h2o那种

(6)a标签

超链接---切换

锚点---定位

常用属性:

href,链接所跳转的位置,可能是其他或当前页面(必须属性)

target窗口打开的方式

_self---当前

_blank---空白窗口

作为锚点:

a标签的name属性值----<a name="top"></a>

其他的id属性值---<div id="top"><div>

锚点的使用---<a href="#top"></a>

(7)img标签

src---需要引入的图片地址(必须属性)

alt---当图片破损或不存在时,显示文本的内容

title---当鼠标悬停在图片上时显示的文本

width---突破安定宽度

height---图片的高度

border---图片边框

(8)表格标签

table---表格,设置宽度(width),高度一般默认,border边框,align对齐方式

<table width="400px"align="center" border="1" style="border-collapse:collapse;">

tr---行

td---标准单元格

th---表头(字体居中,加粗效果)


三、跟随视频进行代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>这是一个HTML页面---常用标签</title>
	</head>
	<body>
		<h1>标题一</h1>
		<h2>标题二</h2>
		<h3>标题三</h3>
		<p>这是一个段落</p>
		<p>这是一个段落</p>
		hello <br>word
		<hr>
		<hr color="palevioletred" size="3" width="50%" align="left">
		<ul type="square">
			<li>概述</li>
			<li>常用标签1</li>
			<li>常用标签2</li>
		</ul>
		<ol type="1">
			<li>概述</li>
			<li>常用标签1</li>
			<li>常用标签2</li>
		</ol>
		<div style="width:500px;height:100px" align="center">这是一个div</div>
		1111<br>
		<span>这是一个span</span>
		1111
		<hr>
		<font color="aqua" size="5">你好</font>
		<font color="aqua" size="5" face="楷体">你好</font>
		<pre>
			hello
			world!
			!     !!
		</pre>
		<p><b>欲买</b><strong>桂花</strong><i>同载酒</i>,<u>只可惜</u><del>故人</del></p>
	</body>
</html>
未完,有继续

四、提交作业? ?

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章           查看所有文章
加:2022-02-05 21:38:52  更:2022-02-05 21:41:43 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 12:23:05-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码