javaweb

最新推荐文章于 2025-12-19 15:39:34 发布

原创最新推荐文章于 2025-12-19 15:39:34 发布 · 71 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#java

网页主要由文字、图片、音频、视频、超链接和表格等元素组成。其背后是程序员编写的前端代码，通过浏览器的解析和渲染呈现给用户。浏览器内核负责这个转化过程。CSS的引入方式包括内联样式、内嵌样式和外联样式，其中外联样式在企业开发中较为常见。颜色可以使用关键字、RGB或十六进制表示。CSS选择器涉及元素选择器、ID选择器和类选择器，用于定位和应用样式。

1). 网页有哪些部分组成 ?

文字、图片、音频、视频、超链接、表格等等。

2). 我们看到的网页，背后的本质是什么 ?

程序员写的前端代码 (备注：在前后端分离的开发模式中，)

3). 前端的代码是如何转换成用户眼中的网页的 ?

通过浏览器转化（解析和渲染）成用户看到的网页

浏览器中对代码进行解析和渲染的部分，称为 浏览器内核

而市面上的浏览器非常多，比如：IE、火狐Firefox、苹果safari、欧朋、谷歌Chrome、QQ浏览器、360浏览器等等。

1.2.1 CSS引入方式

具体有3种引入方式，语法如下表格所示：

名称	语法描述	示例
行内样式	在标签内使用style属性，属性值是css属性键值对	<h1 style=“xxx:xxx;”>中国新闻网</h1>
内嵌样式	定义<style>标签，在标签内部定义css样式	<style> h1 {…} </style>
外联样式	定义<link>标签，通过href属性引入外部css文件	<link rel=“stylesheet” href=“css/news.css”>

对于上述3种引入方式，企业开发的使用情况如下：

内联样式会出现大量的代码冗余，不方便后期的维护，所以不常用。
内部样式，通过定义css选择器，让样式作用于当前页面的指定的标签上。
外部样式，html和css实现了完全的分离，企业开发常用方式。

1.2.2 颜色表示

在前端程序开发中，颜色的表示方式常见的有如下三种：

表示方式	表示含义	取值
关键字	预定义的颜色名	red、green、blue…
rgb表示法	红绿蓝三原色，每项取值范围：0-255	rgb(0,0,0)、rgb(255,255,255)、rgb(255,0,0)
十六进制表示法	#开头，将数字转换成十六进制表示	#000000、#ff0000、#cccccc，简写：#000、#ccc

1.2.3 CSS选择器

选择器通用语法如下：

选择器名   {
    css样式名：css样式值;
    css样式名：css样式值;
}

1.元素（标签）选择器：

选择器的名字必须是标签的名字
作用：选择器中的样式会作用于所有同名的标签上

元素名称 {
    css样式名:css样式值；
}

例子如下：

 div{
     color: red;
 }

2.id选择器:

选择器的名字前面需要加上#
作用：选择器中的样式会作用于指定id的标签上，而且有且只有一个标签（由于id是唯一的）

#id属性值 {
    css样式名:css样式值；
}

例子如下：

#did {
    color: blue;
}

3.类选择器：

选择器的名字前面需要加上 .
作用：选择器中的样式会作用于所有class的属性值和该名字一样的标签上，可以是多个

.class属性值 {
    css样式名:css样式值；
}

例子如下：

.cls{
     color: green;
 }