HTML+CSS学习笔记

shsjjjs

已于 2022-10-28 17:46:29 修改

阅读量724

点赞数

文章标签： css html 学习

于 2022-10-21 02:07:33 首次发布

本文链接：https://blog.csdn.net/shsjjjs/article/details/127394415

版权

这篇博客详细介绍了HTML和CSS的基础知识，包括HTML的结构和属性、CSS语法、样式的引入方式以及常用标签和样式设置。通过学习，读者将掌握如何查看网页源代码、使用VS Code编辑器、编写HTML初始代码、应用CSS样式，以及理解HTML语义化的重要性。同时，博客还涉及了表格、表单、列表和CSS的背景、边框、文字样式等内容。

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

@[TOC]HTML+CSS学习笔记

导学

1、什么是HTML和CSS

是做网站的编程语言
浏览器把代码解析后的样子就是我们看到的网站

如何看到网站的原始代码？

通过鼠标右键选择查看网页源代码

如何去写代码？

一个网站是由多个网页组成的。每一个网页都是.html文件
查看里勾选文件扩展名文件修改成.html再用记事本打开输入内容

2、VS Code 编辑器

VS Code 下载地址

如何安装插件

语言包、open in broswer 、view in broswer

学习编辑器基本使用

设置：文件>>首选项>>设置（大小、是否换行）

快捷键

ctrl+s保存
ctrl+a全选
ctrl+x剪切
ctrl+z撤销
ctrl+y前进
shift+end从头选中一行
shift+home从尾部选中一行
shift+alt+↓快速选中一行
alt+↑或↓快速移动一行
shift+tab往前缩进
alt+点击多光标
ctrl+d选择相同元素的下一个

chrome浏览器下载地址

深入了解网站开发

HTML+CSS
HTML:结构
CSS：样式
JS：行为
HTML一般需要CSS和JS来配合使用
CSS一般不能脱离HTML和XML
JS可以脱离HTML和CSS而独立存在
JS可以操作HTML和CSS

web三大核心技术

HTML CSS JS

HTML基本结构和属性

HTML:超文本标记语言
超文本：文本内容+非文本内容（图片、视频、音频等）
标记：<单词>
语言：编程语言
标记也叫作标签：

<header>
<footer>

写法分成两种：

单标签<header>
双标签<header></header>

创建标签的快捷键单词+tab键
HTML常见标签

标签的属性来修饰标签的，设置标签的一些功能
<标签属性=“值” 属性2=“值2”>

HTML初始代码

每个.html文件都有的代码叫做初始代码，要符合.html文件的规范写法
！+tab键：快速地创建html的初始代码

<!DOCTYPE html>    文档声明：告诉浏览器这是一个.html文件
<html lang="en">          html文件的最外层标签：包裹着所有html标签代码
<head>
    <meta charset="UTF-8">   元信息：是编写网页中的一些赋值信息
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title> 设置网页的标题
</head>
<body>   显示网页内容的区域
    
</body>
</html>

lang=“en” 英文网站 lang=“zh-CN"中文网站