HTML与CSS入门--第四章 理解层叠样式表_html/css_WEB-ITnose
知识点:
1.创建基本样式表的方法
2.使用样式类的方法
3.使用样式ID的方法
4.构建内部样式表和嵌入样式的方法
4.1 CSS工作原理:
CSS:层叠样式表的缩写,是一种定义样式结构如字体、颜色、位置等的语言,被用于描述网页上的信息格式化和实现的方式。
扩展名:.css
分内部样式表,外部样式表以及内联样式表
"层叠"的概念理解:(有助于理解CSS的优先级)CSS样式表中的样式会形成一个层次结构,更具体的样式会覆盖通用的样式。优先级由CSS根据这个层级结构决定,从而实现级联效果。可以用类似继承的关系来理解。
PS:元素的概念:表示标签及其内部的描述信息(如属性、文本、图像等)。
4.2 一个基本的样式表:
标准的额书写方式:一行一个样式规则,便于阅读。
字体专栏,需要抓一个时间段来分析一下,包括字体家族以及字体大小
简单地列一下字体大小的各种单位:
pt:点,1英寸相当于72点
in:英寸
cm:厘米
px:像素
em:字母m的宽度
4.3 CSS样式入门:
CSS中的样式属性分为两大类:
布局属性:影响网页上元素位置的属性。
格式化属性:影响网站中元素的视觉显示的属性。
布局属性之display: block:块元素,自带clear:both
list-item:列表项处理 /*从目前的实际角度来看与block没有什么区别*/
inline,none,其他……
布局属性之width,height
格式化属性之border:最新增加border-radius可以控制矩形的圆角
格式化属性之font:
1.text-decoration常用于删去链接的下划线
2.line-height设置文本行高
4.4 使用样式类:
当需要使网页中的有些文本域其他文本不同时,可以通过创建自定义HTML标签。
我们这里所说的定义的特殊格式文本称为样式类。因此它使一组自定义的格式化说明。例子:
h1 { color:blue }
h1是选择符;color是样式属性;blue是该属性的值
选择符:标签(h1),类(.title),ID(#container)等……
PS:注意组合选择器中"标签.类"与"标签 .类"的区别。
4.5 使用样式ID:
出于布局,格式化,与后台交互的考虑都可以选择使用ID。
ID在同一个页面中必须唯一存在。
4.6 内部样式表和内联样式:
内部样式表:
内联样式:style属性
PS:外部样式表,link,注意需要href,type以及rel属性

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen



Der Artikel erörtert den HTML & lt; Progress & gt; Element, Absicht, Styling und Unterschiede vom & lt; Meter & gt; Element. Das Hauptaugenmerk liegt auf der Verwendung & lt; Fortschritt & gt; Für Aufgabenabschluss und & lt; Meter & gt; für stati

Der Artikel erörtert den HTML & lt; Datalist & gt; Element, das die Formulare verbessert, indem automatische Vorschläge bereitgestellt, die Benutzererfahrung verbessert und Fehler reduziert werden.Character Count: 159

Der Artikel erörtert das HTML & lt; Meter & gt; Element, verwendet zur Anzeige von Skalar- oder Bruchwerten innerhalb eines Bereichs und seine gemeinsamen Anwendungen in der Webentwicklung. Es differenziert & lt; Meter & gt; von & lt; Fortschritt & gt; und Ex

In dem Artikel wird das Ansichtsfenster -Meta -Tag erörtert, das für das reaktionsschnelle Webdesign auf mobilen Geräten unerlässlich ist. Es wird erläutert, wie die ordnungsgemäße Verwendung eine optimale Skalierung von Inhalten und Benutzerinteraktion gewährleistet, während Missbrauch zu Design- und Zugänglichkeitsproblemen führen kann.

Der Artikel erörtert das & lt; iframe & gt; Der Zweck von Tag, externe Inhalte in Webseiten, seine gemeinsamen Verwendungen, Sicherheitsrisiken und Alternativen wie Objekt -Tags und APIs einzubetten.

HTML ist für Anfänger geeignet, da es einfach und leicht zu lernen ist und schnell Ergebnisse sehen kann. 1) Die Lernkurve von HTML ist glatt und leicht zu beginnen. 2) Beherrschen Sie einfach die grundlegenden Tags, um Webseiten zu erstellen. 3) hohe Flexibilität und kann in Kombination mit CSS und JavaScript verwendet werden. 4) Reiche Lernressourcen und moderne Tools unterstützen den Lernprozess.

HTML definiert die Webstruktur, CSS ist für Stil und Layout verantwortlich, und JavaScript ergibt eine dynamische Interaktion. Die drei erfüllen ihre Aufgaben in der Webentwicklung und erstellen gemeinsam eine farbenfrohe Website.

AnexampleofaTartingTaginHtmlis, die, die starttagsaresesinginhtmlastheyinitiateElements, definetheirtypes, andarecrucialForstructuringwebpages und -konstruktionsthedoms.
