爬虫-前端基础

最新推荐文章于 2023-10-24 14:52:16 发布

D_Ray_

最新推荐文章于 2023-10-24 14:52:16 发布

阅读量771

点赞数

分类专栏：笔记文章标签： html css javascript

本文链接：https://blog.csdn.net/D_Ray_/article/details/119577636

版权

本文详细介绍了前端开发的三大核心技术：HTML、CSS和JavaScript。从基础的HTML标签如head、文本、图片、链接到CSS语法和选择器的深入探讨，是初学者入门前端开发的重要参考资料。

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

前端的三大工具

<!-- 
 1. 网页的技术结构：HTML、CSS、JS(javascript)
 HTML(结构标准)    -    提供网页内容（通过不同的标签提供不同的内容）
 CSS(样式标准)         -       负责网页内容的样式布局
 JS(行为标准)     -     负责控制网页内容变化
 
 
 2. HTML - 超文本标记语法
 一个网页就是一个html，html代码一般写在可以被浏览器直接解析的html文件中
 1）html基本结构：一个html标签里面包含一个head标签和一个body标签
 html标签   -   代表整个网页
 head标签   -   网页顶部负责显示网页图标和标题的部分（还负责不可见的设置性的内容）
 body标签   -   负责网页内容的显示
 
 2）标签语法：html是通过不同的标签来提供不同的网页内容，标签从结构上来讲分为两种：
 a. 双标签: <标签名 属性名1=属性值1 属性名2=属性值2 ...>标签内容</标签名>
 b. 单标签: <标签名 属性名1=属性值1 属性名2=属性值2 ...>、 <标签名 属性名1=属性值1 属性名2=属性值2 .../>
 
 说明：
 a. 标签名和<以及>之间不能有空隙（注意空隙）
 b. 属性值不管是什么类型的数据都必须使用双引号引起来
 c. 双标的标签内容可以是任何内容：包括纯文字、也可以是一个或者多个标签或者是文字和标签的混合
 d. 标签名不是由程序员自己创建的，而是html提供的
 -->


<!-- html版本说明： html表示的就是html5 -->
<!DOCTYPE html>   

<!-- 网页基本结构 -->
<html>
	<head>
        <!-- 设置网页编码方式 -->
		<meta charset="utf-8" />
        <!-- 设置网页标题 -->
		<title>hello world</title>
	</head>
	<body>
		
	</body>
</html>

head中的标签

<!DOCTYPE html>
<html>
	<head>
        <!-- 1.设置编码方式 -->
		<meta charset="utf-8">
        <!-- 2.设置网页标题 -->
		<title>head中的标签</title>
        <!-- 3.设置网页图标 -->
        <link rel="icon" type="image/ico" href="img/jd_logo.ico"/>
        <!-- <link rel="stylesheet" type="text/css" href=""/> -->
        <!-- <style type="text/css">
            
        </style> -->
        <!-- <script type="text/javascript">
            
        </script> -->
  
	</head>
	<body>
	</body>
</html>

文本标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
        <!-- 1.标题标签：h1~h6 -->
        <h1>================1. 标题标签=================</h1>
        <h1>一级标题</h1>
        <h2>二级标题</h2>
        <h3>三级标题</h3>
        <h4>四级标题</h4>
        <h5>五级标题</h5>
        <h6>六级标题</h6>
        
        <!-- 2.段落标签: p -->
        <h1>================2. 段落标签=================</h1>
        <p>8月10日凌晨5点，《乡村爱情变奏曲》导演周英男发长文悼念因车祸去世的于月仙，一共3200余字，读来令人泪奔。</p>
        <p>周英男表示，到了凌晨两点多，他仍然无法入睡，翻看和于月仙的聊天记录，回忆昔日点点滴滴，他甚至已经忘记自己是第几次落泪了。</p>
        <p>早在6日，周英男的姑妈因癌症去世，8日刚刚出殡，9日中午他醒来后，就收到朋友发来的消息，最初甚至还以为是噩梦。直到下午接到师父刘流的电话，才不得不面对事实。</p>
        <p>数据</p>
        <p>分析</p>
        
        <!-- 3.普通的文本标签(行内文本标签): font、span、label -->
        <h1>================3. 行内文本标签=================</h1>
        <span>发布时间: 08-10</span>
        <span>06:25</span> <br><br><br>
        <span>娱乐领域创作者</span>
        
        <!-- 4.文字效果相关标签和符号 
        加粗：b、strong
        倾斜：i、em
        换行：br   (在代码中直接按回车换行无效)
        空格：&nbsp;   &emsp; (不是标签是符号)
        -->