发表于: 2019-02-27 23:32:27
1 784
今天完成的事情:
学习了在html中插入样式表的三种方法,实践回顾了前几天所学到的内容,在实践中认识了<title></title>标签对。
明天计划的事情:
探索css中针对html元素还有哪些声明,再次付诸应用。按照任务一具体步骤计划探索盒子模型。
遇到的问题:
sublime有着很棒的自动补全代码的功能,这样会不会因为自己形成了对自动补全的依赖而忘记了一行代码语法的细节?自己已经发现自己在编辑<link>这一个标签时没有想起来link中应该有的声明内容,希望能够在享受自动补全的便利同时也要能够加强对语法的记忆。
<a href="">这一个标签里面引号中的内容在自己最初输入单纯的en.wikipedia.org打开时出错,提示找不到我html所在文件夹下名叫en.wikipedia.org的文件。尝试后发现在前面加入https://(就像自己的浏览器地址栏里面的内容一样)然后链接就可以正常跳转到wikipedia。
https://的意义是什么?为什么几乎所有浏览的网页地址最开头都是这样的?这些内容会在之后尝试在网络上查找答案。
自己不知道css文件中除了更改文字标题链接等元素的颜色还能干什么?自己觉得应该去查阅一下css的一些类似工具书的资料,了解一下还有哪些声明可以使用。
外部样式表能否替代内部样式表?如果同时针对某个元素外部和内部样式表有着不同的定义,元素应该是优先服从谁的定义?
收获:
三种在html中插入样式表的方法:外部样式表()、内部样式表()、内联样式()。
外部样式表的基本格式:在html的<head>标签对之间插入这样的语句:<link rel="stylesheet" type="text/css" href="mystyle.css">注意到这样三个声明之间没有分号或者逗号作为分隔。
外部样式表适合于当样式需要被应用到很多html页面的情况。
内部样式表的基本格式:在<head>标签对之间使用<style>标签对。这个标签对结构如下:
<style type="text/css">
body {background-color: green}
p {margin-left: 20px}
</style>
内部样式表可以用在单个html文件需要特别样式的情况。
内联样式的基本格式(以正文p为例):
<p style="color: red; margin-left: 20px">
Something is going on here.
</p>
内联样式可以针对个别的元素应用样式。
今天简要回顾了几天所学的操作。打开sublime文本编辑器编辑html文档,发现输入<html后按下回车,sublime自动补全了如图示的内容。
图中出现了一个新的以前没有见到的标签对<title></title>,尝试在其中输入Title?这一串字符,然后在<body></body>中复习自己学过的<h1></h1>、<p></p>、<br />、<a></a>这些tag,练习内容如图示。使用浏览器打开这一html文件,发现标签页上面出现了自己在<title></title>中出现的字符。
单击click here to visit wikipedia这一自己设计的超链接时,出现了这样的错误,如图所示:
大意为浏览器不能找到在自己html文件所在文件目录下的名为en.wikipedia.org的文件。自己分析认为是href需要一个准确的说明自己要链接到的是一个互联网上的网站,然后自己想到了浏览器的地址栏里面会显示的网址,然后对自己出错的href作出如下修改,如图所示:
修改后重新打开自己的html文件测试链接,发现链接已经可以正常工作。如图所示;
在自己的html文档所在目录下建立一个css文件,自己输入了如图所示的内容,因为自己并不知道css里能够对元素做什么样的修饰,自己就尝试了简单的更改颜色。在html文件中<head></head>之间插入<link>,因为有自动补全,自己仅仅需要在href后面的引号中输入自己css文件的文件名,在浏览器中重新加载自己的html文档,结果如图所示。
评论