HTML基础

最新推荐文章于 2024-10-09 11:42:00 发布
最新推荐文章于 2024-10-09 11:42:00 发布
阅读量425 收藏 9
点赞数 3
分类专栏： HTML5+CSS3 文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2401_83279223/article/details/142151632
版权

## HTML基础

### 1.Web前端

* HTML:超文本标记语言，描述页面的结构。相当于人的身体组织结构

* CSS：美化页面的样式。相当于人的衣服打扮

* JS：描述页面的行为。相当于人的动作

### 2.HTML骨架

```

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

   

</body>

</html>

```

### 3.元素

```

1. 图像

<img src="路径" alt="当图片不显示时，显示文字" title="鼠标悬停显示的文字">

2.超链接

<a href="链接" target="目标窗口跳转的形式"></a>

3.标题

<h1>到<h6>

<h1>这个是一级标题</h1>

4.列表

    无序列表

    <ul>

        <li></li>

        <li></li>

        <li></li>

    </ul>

    有序列表

    <ol>

        <li></li>

        <li></li>

        <li></li>

    </ol>

### 排版标签

1. 标题标签

```

<h1>-<h6> 具有align属性，left right center

```

2. 水平线标签

```

<hr/>

<hr/ align="属性值" color="" width="" size="" noshade>

noshade不要阴影

```

3. 换行```<br/>```

4. 段落标签

```

<P>里面只能放文字，图片，表单元素

```

5. div和span标签

```

<div>可以把标签中的内容分割为独立的区块，独占一行

<span>和div作用一样，但是不换行

区别：<div>换行，<span>不换行

```

6. 内容居中标签```<center>```

7. 预定义(预格式化)标签

```

<pre>保留标签内部所有的空白字符，原封不动输出结果

```

## 字体标签

### 1.特殊字符

    `&nbsp;`:空格

    `&lt;`:小于号<

    `&gt;`:大于号>

    `&amp;`:&

### 2.字体标签

* 下划线 text-decoration：underline

* 斜体 font-style：italic

* 中划线 text-decoration：line-through

* 加粗 font-weight

* 字体样式 font-family

* 字体大小 font-size

* 上标&lt;sup&gt;

* 下标&lt;sub&gt;

## 超链接

### 1.外部链接 （链接到外部文件）

`<a href="目标url">aaaaa</a>`

### 2.锚链接

* `<a href="" name="aa">顶部</a>`

* `<a href="#aa">回到顶部</a>`

### 3.邮件链接

### 4.属性

```

href：目标URL

title：悬停文本

name：锚点名称

target：用什么方式打开目标页面

    _self:在同一个网页打开（默认）

    _blank:在新窗口打开

    _partent:在父窗口中显示

    _top:在顶级窗口显示

```

## 图片标签

* <img src="路径" title="悬停文本" alt="图片显示不了时，显示文本">

* width 宽度 height高度 等比例缩放，只要设置一个的值

煎饼果子呀
关注
专栏目录
html基础教程之HTML 标题
html基础教程
02-03 4516
HTML标题 在 HTML 文档中，标题很重要。 HTML 标题 标题（Heading）是通过 <h1> – <h6> 标签进行定义的. <h1> 定义最大的标题。 <h6> 定义最小的标题。 实例 <h1>这是一个标题。</h1> <h2>这是一个标题。</h2> <h3>这...
HTML基础网页布局代码写法
m0_51826406的博客
03-07 8839
W3C标准 W3C World Wide Web Consortium 万维网联盟 中立性技术标准机构 W3C标准包括 结构化标准语言（HTML XML） 表现标准语言（CSS） 行为标准（DOM ECMAScript） 在idea创建一个工程 开始学习HTML基础 <!--注释 DOCTYPE：告诉浏览器我们使用什么规范 --> <!DOCTYPE html> <html lang="en"> <!-- head代表网页头部 --> <hea
Word中的Visio图直接转换为图片
BuquTianya的专栏
11-27 3万+
    ctrl+A （全选）   ctrl+shift+f9 （转换）     ~~~~~~~~~~~~~~~~~~~~~~~~~ **福利分割线**~~~~~~~~~~~~~~~~~~~~~~~~~~~ -长期内推-：头条、快手、美团、阿里、陌陌、当当。有需要的朋友可以发邮件到我的邮箱xiaofan860412@163.com。...
html中占位隐藏,css样式占位和不占位隐藏元素的方法
weixin_31764905的博客
05-30 2073
css样式常用display: none;与visibility: hidden;方法设置元素隐藏，其中display:none方法隐藏元素不占位，visibility: hidden;方法隐藏元素占位。下面我们来看一下这两种方法如何使用。display属性介绍：display：none可以隐藏某个元素，且隐藏的元素不会占用任何空间。该元素不但被隐藏了，而且该元素原本占用的空间也会从页面布局中消失...
html标签隐藏占位,css如何隐藏元素不占位？
weixin_33781072的博客
05-31 882
用 CSS 隐藏页面元素有许多种方法。你可以将 opacity 设为 0、将 visibility 设为 hidden、将 display 设为 none 等方式隐藏元素。css使用display属性隐藏元素不会占位置。display 属性依照词义真正隐藏元素。将 display 属性设为 none 确保元素不可见并且连盒模型也不生成。使用这个属性，被隐藏的元素不占据任何空间。不仅如此，一旦 di...
Html隐藏占空间与隐藏不占空间
刘德利CSDN博客
08-14 3万+
隐藏不占用空间：display:none;以下为示例代码：<span style="display:none;"> 获取中</span>隐藏占用空间： visibility:hidden;以下为示例代码：<span style="visibility:hidden;"> 获取中</span>
html控件隐藏几种方法，占位隐藏
weixin_34185320的博客
11-19 2927
2019独角兽企业重金招聘Python工程师标准>>> ...
HTML零基础入门教程（详细）
热门推荐
ZONGXP的博客
10-22 23万+
HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。 HTML 指的是超文本标记语言:HyperTextMarkupL...
HTML基础知识
xuan971130的博客
03-02 2946
一、基础知识： 1.网站：许多网页的集合。 2.HTML：超文本标记语言（Hyper Text Markup Language），用来描述网页的一种语言。不是一种变编程语言，而是一种标记语言。 3.浏览器内核（渲染引擎）：负责读取网页内容，整理讯息、计算网页的显示方式并显示页面。 4.Web标准的组成 ...
HTML基础模板
qq_61690596的博客
07-18 2108
HTML基本模板，每个基础元素的内容和作用
HTML基础练习题
weixin_50108821的博客
09-23 1万+
第一题 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>嘿嘿嘿</title> </head> <body> <table border="1" cellspacing="0" cellpadding="0"> <tr align="center">
《Web程序设计基础R》实验报告---HTML基础
一只小鹿的博客
12-21 4839
一、实验目的 1．掌握常用的HTML语言标记； 2．利用文本编辑器建立HTML文档，制作简单表单页面。 二、实验环境 计算机、Windows10 操作系统 三、实验内容、源码及运行结果 1．  实验内容 在文本编辑器“记事本”中输入如下的HTML代码程序，以文件名sy1.html保存，并在浏览器中运行。（请仔细阅读下列程序语句，理解每条语句的作用） 源程序清单如下： 1. <html> 2. <head> 3. <title>Example</title&
html渲染优先级
2301_81449444的博客
10-07 321
当遇到具有浮动属性的元素时，浏览器会将其从正常的文档流中脱离出来，并按照设定的浮动方向移动。需要注意的是，在具体的场景中，元素的渲染优先级可能会受到其他因素的影响，如CSS的选择器、样式表的顺序等。一般来说，块级元素的渲染优先级高于行内元素，而行内元素的渲染优先级又高于浮动元素和定位元素。在CSS中，元素的渲染优先级是由元素的类型和CSS的特定规则决定的。定位流的元素会脱离文档流，根据设定的位置放置，可能会覆盖文档流中的其他元素。浮动流的元素会脱离文档流，根据设定的浮动方向移动，后面的文档流会重新排列。
XHTML 简介
wjs2024的博客
10-04 604
XHTML作为一种严格的、基于XML的标记语言，为网页设计和开发提供了良好的可读性、可维护性和扩展性。尽管HTML5已成为当前主流的网页标记语言，但XHTML在特定领域仍然具有广泛的应用价值。
HTML:相关概念以及标签
2301_80418172的博客
10-04 1108
我们平时使用电脑和手机都是离不开网站和网页的,那么什么是网页呢?什么又是网站呢?网页就是网站的一页,网页就是一个后缀为html的文件,通过浏览器读取然后就是我们所看到的各中有画面的网页了;不信?我们在一个网页中右键点击打开网页源代码,你就会发现源代码就是就是使用的html语言写的;网站就是指在因特网上根据一定的规则,使用HTML等制作的作用于展示特定内容相关的网页集合;网页是构成网站的基本元素,它通常是由图片,链接,文字,声音,视频等元素组成。
HTML 常用的块级元素和行内元素
最新发布
u010194271的博客
10-09 404
块级元素行内元素divspanpah1-h6strongul,olli,emtablei,b,ublockquoteimgbrcodenavlabelaside。
html复习
m0_46533814的博客
10-05 594
dl即description-list描述列表，dt即description-term写描述的对象是谁，dd即description-data对该对象的描述内容。：code标签是用来包裹代码片段的，代码的字母一般是等宽的，如不加code，字母不等宽，代码不好看。head标签部分一般放相关设置内容，页面显示的内容是在body中编写，在body标签中body被一些标签划分成有结构的部分。：em即emphasis强调的意思，可用于强调一句话中的某个词，显示样式为斜体，样式可改。：块级元素，表示文本的一个段落。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值