HTML & CSS基础

最新推荐文章于 2023-02-01 20:01:28 发布

冷淡的蛋黄酱

最新推荐文章于 2023-02-01 20:01:28 发布

阅读量144

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_52730784/article/details/112567803

版权

这篇博客介绍了HTML和CSS的基础知识，包括前端开发的简介、HTML的基本格式和常用标签、图片标签的使用、XHTML的语法规范、内联框架、超链接的概念以及CSS样式和选择器。内容覆盖了网页开发的基本要素，适合初学者入门。

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

目录
01 | 前端简介
02 | HTML基础知识
03 | 图片标签
04 | XHTML语法规范
05 | 内联框架
06 | 超链接
07 | CSS基础

01 | 前端简介

1.软件开发类型:C/S B/S

2.软件开发流程
    -网页设计师根据需求出图
    -前端工程师将图制作成网页
    -后端工程师改为动态 / 前端自己改 /给后端提需求,用接口改

3.前端组成

4.所需工具
    -浏览器
    -编辑器:记事本、NotePad++、HBuilder
    -调试工具:FireBug
    -图片工具:photoshop

5.进制的简介
①X进制就是满X进一
②常见进制:
    -二进制:0、1、10、11、100、101、110、111、1000、1001…
    -十进制 :0…9、10…19、20…
    -八进制 :0、1、2…7、10…17、20…27、30…
    -十六进制

02 | HTML简介

1.HTML基本格式
①版本声明
②包含标签html和子标签head,body
其中head包含utf-8注释和title标签
③html的注释
④设置中文标签

<!doctype html> 
<!--声明这个网页是以html5的标准来写的
如果不声明,一些浏览器会无法识别-->
<html>
    <!--html是根标签,包含head和body两个子标签-->
    <head>    
        <meta charset="utf-8"/>
        <!--中文标签,meta是一个自结束标签,结尾要加/-->
        
    <!--head内容是给浏览器看的,显示的内容要写在body里
    title的内容会影响搜索排名
    -->
        <title></title>    
    </head> 
    <body>
     <!--所有可视化的东西都要放在body里面-->
    </body>
</html>

<!--运用上面的原则,写一个简单的html文件,并设置内容格式-->
<!doctype html> <!--文件声明-->
<html>
    <head>
        <meta charest = "utf-8"/>
        <title>first</title>
        <!--网页title,给浏览器显示的-->
    </head>
    <body>
        <!--h1是命名为标题-->
        <!--将“第一个”设置为橙色可以设置多个属性,
        以空格隔开但是属性一般通过css设置，不建议用这种标签-->
        <h1>这是我的<font color = 'orange' size = 7>第一个</font>网页</h1>
    </body>
</html>

在这里插入图片描述

2.常用标签
① h标签 标题标签
    -六级标题中从h1到h6重要性依次递减
    -搜索引擎优先检索head,其次是h1
    -一般只有一个h1,页面中h4~h6基本不用
②p标签 段落标签
③hr标签 br标签是自结束标签
④meta标签
    -规定HTML 文档的字符编码
    -设置网页的关键字
    -指定网页的描述
    -做请求的重定向
⑤input标签
    -在页面放置一个文本框

<!doctype html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title></title>
        <meta name = "keyword" content = "html5,JavaScript,前端,java"/> <!--关键词-->
        <meta name = 'description' content = '发布h5、js、前端'/> <!--描述-->
        <meta http-equiv = 'refresh' content = '5;url = http://www.baidu.com'>
        <!--5秒后跳转百度-->
        <!--meta有两个属性,name是描述content,head里面都是看不见的,这是给搜索引擎检索用的-->
    </head>
    <body>
        <!--html中共有六级标题标签-->
        <h1>一级标题</h1>

最低0.47元/天解锁文章

冷淡的蛋黄酱

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML & CSS基础

目录01 | 前端简介02 | HTML简介01 | 前端简介1.软件开发类型:C/S B/S2.软件开发流程-网页设计师根据需求出图-前端工程师将图制作成网页-后端工程师改为动态 / 前端自己改 /给后端提需求,用接口改3.前端组成4.所需工具-浏览器-编辑器:记事本、NotePad++、HBuilder-调试工具:FireBug-图片工具:photoshop02 | HTML简介1.HTML基本格式①包含标签html和子标签head,body<h.
复制链接

扫一扫

专栏目录