学制作网页的一些笔记

缺乏、安全感 2022-09-26 03:22 178阅读 0赞

三种语言：

1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。

2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。

3. JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。

标签：

html中的标签一般都是成对出现的，分开始标签和结束标签。结束标签比开始标签多了一个“/”。

<span>标签是没有语义的，它的作用就是为了设置单独的样式用的。

如果现在我们想把上一小节的第一段话“美国梦”三个字设置成blue（蓝色），但注意不是为了强调“美国梦”，而只是想为它设置和其它文字不同的样式（并不想让屏幕阅读器对“美国梦”这三个字加重音读出），所以这样情况下就可以用到<span>标签了。

在 html 代码中输入回车、空格都是没有作用的。在html文本中想输入回车换行，就必须输入<br/>。

<tbody>…</tbody>：当表格内容非常多时，表格会下载一点显示一点，但如果加上<tbody>标签后，这个表格就要等表格内容全部下载完才会显示。如右侧代码编辑器中的代码。

<img src="图片地址" alt="下载失败时的替换文本"title = "提示文本">

1.<form> ：<form>标签是成对出现的，以<form>开始，以</form>结束。

2.action ：浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。

3.method ： 数据传送的方式（get/post）。

<form method="post" action="save.php">

<label for="username">用户名:</label>

<input type="text" name="username" />

<label for="pass">密码:</label>

<input type="password" name="pass" />

</form>

语法：

<form>

<input type="text/password" name="名称" value="文本" />

</form>

1、type：

当type="text"时，输入框为文本输入框;

当type="password"时, 输入框为密码输入框。

2、name：为文本框命名，以备后台程序ASP 、PHP使用。

3、value：为文本输入框设置默认值。(一般起到提示作用)

<input type="radio/checkbox" value="值" name="名称" checked="checked"/>

1、type:

当 type="radio" 时，控件为单选框

当 type="checkbox" 时，控件为复选框

2、value：提交数据到服务器的值（后台程序PHP使用）

3、name：为控件命名，以备后台程序 ASP、PHP 使用

4、checked：当设置checked="checked" 时，该选项被默认选中

CSS样式：

p\{

font-size:20px;/\*设置文字字号\*/

color:red;/\*设置文字颜色\*/

font-weight:bold;/\*设置字体加粗\*/

\}

单独设置字体颜色：

span\{

color:blue;

\}

</style>

</head>

<body>

<p>慕课网，<span>超酷的互联网</span>、IT技术免费学习平台，创新的网络一站式学习、实践体验；<span>服务及时贴心</span>，内容专业、<span>有趣易学</span>。专注服务互联网工程师快速成为技术高手！</p>

</body>

</html>

CSS样式可以写在哪些地方呢？从CSS 样式代码插入的形式来看基本可以分为以下3种：内联式、嵌入式和外部式三种。

优先级：内联式 > 嵌入式 > 外部式

更有趣的是伪类选择符，为什么叫做伪类选择符，它允许给html不存在的标签（标签的某种状态）设置样式，比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色：

a:hover\{color:red;\}

上面一行代码就是为 a 标签鼠标滑过的状态设置字体颜色变红。这样就会使第一段文字内容中的“胆小如鼠”文字加入鼠标滑过字体颜色变为红色特效。

div\{

padding-top:20px;

padding-right:10px;

padding-bottom:15px;

padding-left:30px;

\}

CSS包含3种基本的布局模型，用英文概括为：Flow、Layer 和 Float。

在网页中，元素有三种布局模型：

1、流动模型（Flow）

2、浮动模型 (Float)

3、层模型（Layer）

发表评论取消回复

表情：

评论列表（有 0 条评论，178人围观）

还没有评论，来说两句吧...

相关阅读

相关我要开始学制作网页我该怎么办呢

如果你想学习制作网页，那么我建议你从以下几个方面入手： 1. 先了解网页的基本构成和工作原理，包括 HTML、CSS 和 JavaScript 等技术。你可以在网上找一些基

冷不防/ 2024年03月25日 15:33/ 0 赞/ 20 阅读

相关网页中嵌套网页制作方法

<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, i

Bertha 。/ 2024年02月27日 05:14/ 0 赞/ 9 阅读

相关 python制作一个网页版的notebook，制作简易的网页记事本笔记本。

templates: includes:(\_footer.html、\_formhelpers.html 、\_messages.html、\_navbar.html

逃离我推掉我的手/ 2022年11月18日 02:09/ 0 赞/ 435 阅读

相关学制作网页的一些笔记

三种语言： 1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。 2. CSS样式是表现。就像网页的外衣。比如，标

缺乏、安全感/ 2022年09月26日 03:22/ 0 赞/ 179 阅读

相关一些有意思的网页

http://blog.csdn.net/carson2005/article/details/8657047 （1）时间管理技师：http://www.gtdli

傷城~/ 2022年08月21日 08:46/ 0 赞/ 247 阅读

相关网页制作中遇到的一些个小问题（3）

1. z-index：css中有position且其值为absolute，relative，fixed，这样才可以生效。其值越大则层叠在最上面；在 IE 浏览器中，定位元

布满荆棘的人生/ 2022年08月06日 00:27/ 0 赞/ 227 阅读

相关网页制作中遇到的一些个小问题（1）

display：table总结（自己的一些个理解总结） IE8是最后一款支持该属性的主流浏览器。在网页元素上应用该属性后，可以模仿出与表格相同的特性。 IE8以下是不能够识

旧城等待，/ 2022年08月06日 00:17/ 0 赞/ 181 阅读

相关 Js制作简单的网页

一个简易的纯JS的CRM管理系统 1 概述这是一个综合的JS开发的管理系统，仅有基本功能，大约1500行代码，使用本地的数据localStorage

╰+哭是因爲堅強的太久メ/ 2022年06月10日 13:38/ 0 赞/ 256 阅读

相关网页制作pdf

前言沉迷农药，抖音，总归是不好的。在要吃苦的年纪里选择安逸，那么老了一定会后悔，埋怨年轻的时候不知道努力的自己。于是又找出了尘封已久的kindle，打算好好看看书，给自

朴灿烈づ我的快乐病毒、/ 2022年05月11日 07:24/ 0 赞/ 265 阅读

相关网页制作：制作一个官网

从范例建立基本步骤使用 DreamWeaver 8.0 软件 1.新建文档 ![20201130213234159.png][] 2.选择一个模板。 ![wat

落日映苍穹つ/ 2021年09月21日 13:18/ 0 赞/ 488 阅读