HTML+CSS入门

最新推荐文章于 2021-12-01 21:12:42 发布

XiaoChong1998

最新推荐文章于 2021-12-01 21:12:42 发布

阅读量1k

点赞数 1

分类专栏： HTML SublimeText3 文章标签： HTML CSS 入门

本文链接：https://blog.csdn.net/qq_43473154/article/details/102714816

版权

本文是HTML和CSS的入门教程，涵盖了HTML的基本结构、常用标签、图像和链接处理，以及CSS的概述、使用方式和选择器等内容。适合初学者学习，以掌握网页制作的基础技能。

摘要由CSDN通过智能技术生成

HTML+CSS入门

前言：

10.24，祝所有程序员们节日快乐，也祝自己节日快乐。

下面都是HTML+CSS入门级常用的一些东西，内容篇幅如果觉得长，可以以目录的形式来飞跃额。。。。。。。希望大家能够一起学习交流，当然要晋升，HTML5+CSS3肯定是要搞的哦！

一、HTML:

1.1HTML简介

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。您可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。

1.2HTML基本结构

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>标题</title>
</head>
<body>
<h1>我是一个标题</h1>
<p>我的一个段落</p>
</body>
</html>

1.3常用HTML标签的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML基本标签的使用测试</title>
</head>
<body>
    <!--HTML注释-->
    <h1>王者荣耀游戏介绍</h1>
    <hr/>
    <p>《<em>王者荣耀</em>》是腾讯第一5V5团队公平竞技手游，<em>国民MOBA手游大作</em>！5V5
    王者峡谷、公平对战、还原MOBA经典体验；契约之战、五军对决、边境突围等，带来花式作战乐趣！10秒实
    时跨区匹配，与好友开黑上分，向最强王者进击！多款英雄任凭选择，<strong>一血、五杀、超神
    </strong>，实力碾压，收割全场！敌军即将到达战场，王者召唤师快来集结好友，准备团战，就在《王者荣
    耀》！</p>
    <h3>游戏特色1</h3>
    <p>一人有祝福 组队不掉星</p>
    <h3>游戏特色2</h3>
    <p>十人趣跑 峡谷热身赛</p>
    <h3>游戏特色3</h3>
    <br/>
    <br/>
    <br/>
    <p>便捷沟通 竞技永不投降</p>
</body>
</html>

1.4图像标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>游戏特色1:一人有祝福 组队不掉星</title>
</head>
<body>
    <h1>一人有祝福 组队不掉星</h1>
    <p>五五开黑节系列福利活动将陆续开启，一人有祝福，组队不掉星！</p>
    <img src="images/01.jpg" alt="一人有祝福 组队不掉星" width="450" title="一人有祝
    福 组队不掉星">
</body>
</html>

1.5超链接标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML基本标签的使用测试</title>
</head>
<body>
    <!--HTML注释-->
    <h1>王者荣耀游戏介绍</h1>
    <hr/>
    <p>《<em>王者荣耀</em>》是腾讯第一5V5团队公平竞技手游，<em>国民MOBA手游大作</em>！5V5
    王者峡谷、公平对战、还原MOBA经典体验；契约之战、五军对决、边境突围等，带来花式作战乐趣！10秒实
    时跨区匹配，与好友开黑上分，向最强王者进击！多款英雄任凭选择，<strong>一血、五杀、超神
    </strong>，实力碾压，收割全场！敌军即将到达战场，王者召唤师快来集结好友，准备团战，就在《王者荣
    耀》！</p>
    <h3><a href="01.html">游戏特色1</a></h3>
    <p>一人有祝福 组队不掉星</p>
    <h3><a href="02.html" title="游戏特色2" target="_blank">游戏特色2</a></h3>
    <p>十人趣跑 峡谷热身赛</p>
    <h3><a href="03.html" target="_self">游戏特色3</a></h3>
    <p>便捷沟通 竞技永不投降</p>
</body>
</html>

1、页面链接：A页到B页，网上常见链接；

2、锚链接：跳至自身固定位置，或A页跳到B页固定位置，需锚标记；

语法格式：

<!--创建跳转标记-->
<a id="top">顶部</a>
<!--创建跳转链接-->
<a href="#top">回到顶部</a>

3、功能性链接：电子邮件、QQ、MSN等链接。

语法格式：

<!--电子邮件、QQ、MSN等链接（PC）-->
<a href="mailto:1207239331@qq.com

最低0.47元/天解锁文章

XiaoChong1998

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录