「HTML」从零开始学网页制作-05 html网页简单制作
gaoyangw 2024-11-13 10:36 20 浏览 0 评论
今天要学习的是CSS,CSS是什么?
CSS指的是层叠样式表,它和HTML是一对好朋友,可以对HTML网页进行修饰。
为什么要学CSS?
要想让浏览器显示以下内容:
以我们所学的知识,就需要一个一个的去添加 font 样式:
非常麻烦,一个网页可能有几百个样式要设置,难道一个一个的去添加吗?即使你很有耐心,这么多的样式全写在一个页面(CSS会新建一个专门存放样式的页面),别说别人了,自己看了都觉得乱。
为了省时省力、简洁易改、维护方便、增强网页……
所以,引入CSS样式表,就是为了解决这些问题。
第一步
在盘符下面建立一个文件夹,在文件夹里面建立两个文档:
例如,我在C盘下面建立了文件夹 new_20200831,在这个文件夹里面在建立两个文本文档,并修改扩展名:new.html 和 newcss.css
之所以放在同一个文件夹里面,是为了更好管理和方便链接,下面的 [1] 会解释为什么方便链接。
打开new.html ,输入基础html代码:
在<head></head>中写入下方代码:
<link href="css 文件的路径" type="text/css" rel="stylesheet" />
<link/> 标签定义文档与外部资源的关系,也就是你想链接CSS样式表,就要用到<link/>标签。
<link/>标签需要放在<head>头部标记中,并且指定3个必需属性:
href:规定被链接文档的位置。 [1]
type:规定被链接文档的类型。这里指定为 “text/css” 表示链接的外部文件为CSS样式表。
rel:规定当前文档与被链接文档之间的关系。这里指定为 “stylesheet” 表示链接的文档是一个样式表文件
——————————————————————————————
[1] 我来解释一下为什么放在同一个文件夹会方便链接:
引用的路径分为两种:
绝对路径:完整描述文件路径
相对路径:相对于当前文件的路径,不带有盘符。(推荐)
相对路径分为以下3种:
· 文件和html文件位于同一文件夹;只需输入文件名即可,如<link href="new.css" />
· 文件位于html文件的下一级文件夹;输入文件夹和文件名,之间用 / 隔开,如 <link href="new_20200831/new.css" />
· 文件位于html文件的上一级文件夹;在文件名之前输入 ../ ,如果是上两级,则需要用 ../../ 以此类推,如 <link href="../new.css" />
例如,上面我输入href="new.css" 就是相对路径的第1种情况,我放在同一个文件夹,所以只要输入文件名 new.css 即可,而不是输入绝对路径 C/new_20200831/new.css ,明显后者麻烦多了。
未完待续~
相关推荐
- 招标公告-网络销售农资治理数据服务项目磋商公告
-
招标公告-网络销售农资治理数据服务项目磋商公告...
- 销售的几种方式(销售的十大方式)
-
以下是几种常见的销售方式介绍:传统线下销售-门店销售:在实体店铺中,销售人员与顾客面对面交流,介绍产品或服务,帮助顾客挑选合适的商品,促成交易。例如在商场的服装专卖店,销售人员会根据顾客的身材、喜...
- AI要干掉SaaS销售?(ai销售是什么意思)
-
随着AI技术的飞速发展,许多行业都在经历前所未有的变革,SaaS销售领域也不例外。最近,行业内关于“AI是否会取代SaaS销售人员”的讨论愈演愈烈,许多从业者感到焦虑不安。然而,SaaS行业老兵大D认...
- 网络上的性暗示广告泛滥,是商业营销手段还是道德底线的滑落?
-
刷到是缘分,感谢大家的阅读,希望您能动动小手帮忙点赞,关注,评论。你的支持和鼓励是我前进的动力。在此祝福大家天天快乐,日日开心!...
- 互联网上,怎么销售 销售是你必须掌握的创造财富的核心技能。
-
互联网上销售2个要点。销售是你必须要掌握的创造财富的核心技能,只有先促成交易才能获得利润。今天的内容非常重要,但是对于很多人来说并不容易理解,因为它和传统的教育理念有很多的冲突。我尽量慢一点,各位好好...
- 浅谈网站优化之站内优化(网站的站内优化)
-
网站优化分为站内优化和站外优化,今天我们只谈站内优化。在给网站做站内优化的同时,我们首先要做一个网站诊断,通过网站诊断,发现网站存在什么问题,然后进行优化。之所以需要优化,是发现网站没有排名,没有流...
- 想成为一个Web前端开发工程师,需要掌握的知识总结
-
前端工程师已经成为目前互联网企业极具竞争力的人才,企业不断提升薪资水平为了招聘到优秀的Web前端开发工程师。因此,越来越多的人想要学习Web前端。那么呢?Web前端的学习路线是什么?下面就和千锋武汉W...
- 合理站内优化-放你200米先跑(200米队伍能站多少人)
-
有一首民谣是这样说的:丢失了一个钉子,坏了一只蹄铁;坏了一只蹄铁,折了一匹战马;折了一匹战马,伤了一位国王;伤了一位国王,输了一场战斗;输了一场战斗,亡了一个帝国。从这首民谣中我们可以提炼出,一个微小...
- 教你分析竞争对手的网站,借鉴快速做好自己网站的SEO
-
关于seo爱好者来说,剖析竞争对手的网站是我们必需要做而且必需要做好的事情。但是很多SEO爱好者只晓得去察看,却不晓得应该如何剖析竞争对手的网站。...
- SEO优化重点在哪里?核心因素(seo的优化基础)
-
seo优化是一个长久的过程,也是一个持续坚持的过程。当然,了解了其中重点的核心因素,会让很多朋友少走很多弯路,所以,今天牵线的木偶想给大家分享下关于SEO比较核心的有些需要重点注意!(完全不了解SE...
- 站内SEO优化需要重视这16点才能提升网站排名!
-
1.H标签网站单个页面的H标签尽量控制在一定数量,常见的用法是h1标签1次,h2标签2次,h3标签用3词,也有很大部分的网站不用h1标签直接使用h2标签,这种情况常见于门户站、新闻站等。2.Alt描述...
- 广州网络包年推广 网络广告包年-易找网络服务中小企业
-
易找网络专注搜索平台关键词优化排名,信息流广告,朋友圈广告,网站建设等,专注于互联网广告业务,致力于帮各类行业广告主提供PC、移动的互联网效果资源,与国内主流媒体建立了深度战略合作。易找是在搜索引擎上...
- 网站建设公司背景与技术实力全面解析
-
今天我要给大家详细讲解一下网站建设公司的情况,这个行业里学问挺多。这些公司能够按照客户的具体要求和需求,制作出功能丰富、外观漂亮的网站,这在互联网领域非常重要。接下来,我们就从几个角度来详细探讨一番。...
- 全有家居朋友圈线上活动策划方案(附下载)
-
部分内容预览...
- 2025商业广场春季营销活动策划方案“春日放飞季”(附下载)
-
部分内容预览...
你 发表评论:
欢迎- 一周热门
- 最近发表
- 标签列表
-
- 网站建设 (107)
- 网站开发 (47)
- 网络推广哪个平台好 (47)
- 百度收录 (50)
- 搜索引擎排名优化 (49)
- 关键词优化工具 (51)
- 外贸网站建设 (56)
- seo整站优化吧 (50)
- 广州seo (47)
- 苏州网站建设 (59)
- 百度搜索推广 (61)
- 关键词优化公司 (51)
- 网页制作 (47)
- 广州网站建设 (48)
- 电商网站建设 (49)
- 百度站长平台 (48)
- 网站收录查询 (46)
- 网站模板 (51)
- 厦门网站建设 (52)
- 百度快照推广 (51)
- 免费网页在线客服系统 (53)
- 雷神代刷网站推广 (53)
- 长尾关键词 (47)
- 手机网站建设 (53)
- 一键优化 (47)