HTML+CSS_html/css_WEB-ITnose
做网站开发都知道,Html是网页开发的基础,而css是我们设计网页美感经常使用的布局手法,本篇为大家记录一下有关两者的基础知识,基础打牢了我们才能走的更远,不论是jsp还是php都不能脱离html存在。
一、HTML标签:
1、加粗标签
2、倾斜标签
3、单独样式
4、引号
5、
长文本引用
6、
地址信息 7、
8、
多行代码
9、
- 从5开始编号
10、
12、a标签的target="_blank":在新的页面打开
13、a标签的title="鼠标滑过显示文本"
14、
15、文本标签:
16、stry:样式标签
17、Email标签:
18、下拉列表也可以进行多选操作,在
19、label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。就是说,当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上(就自动选中和该label标签相关连的表单控件上)。
<form> <label for="male">男</label> <input type="radio" name="sex" id="male" /> <br /> <label for="female">女</label> <input type="radio" name="sex" id="female" /> <label for="email">输入你的邮箱地址</label> <input type="email" id="email" placeholder="Enter email"></form>
对于HTML中的常用标签就为大家总结到此,这些标签常用但不太容易记忆,本篇就是方便大家使用是查阅。下面我们一起温习一下CSS的基础知识吧。
二、CSS:
1、css的样式:内联式、嵌入式、外部式
2、css的选择器分为:A、标签选择器:body{}B、类选择器:.setGreen{}C、ID选择器:#setGreen{}D、通用选择器:*{}
3、文字排版:
font-family:"宋体";
font-weight:bold;粗体
text-decoration:line-through;删除线
text-decoration:underline;下划线
text-indent:2em;缩进2个字节
line-height:1.5em;行间距为1.5个字节
letter-spacing:1.5em;字间距、字母间距
4、三种方法的优先级:内联式 > 嵌入式 > 外部式,但是嵌入式>外部式有一个前提:嵌入式css样式的位置一定在外部式的后面。如右代码编辑器就是这样,代码在代码的前面(实际开发中也是这么写的)。感兴趣的小伙伴可以试一下,把它们调换顺序,再看他们的优先级是否变化。其实总结来说,就是--就近原则(离被设置元素越近优先级别越高)。
5、伪类选择符:更有趣的是伪类选择符,为什么叫做伪类选择符,它允许给html不存在的标签(标签的某种状态)设置样式,比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色(a:hover{color:red;})。
6、分组选择符:当你想为html中多个标签元素设置同一个样式时,可以使用分组选择符(,),如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色:h1,span{color:red;}它相当于下面两行代码:h1{color:red;}span{color:red;}
7、权值的规则:标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。例如下面的代码:
p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
注意:还有一个权值比较特殊--继承也有权值但很低,有的文献提出它只有0.1,所以可以理解为继承的权值最低。
8、元素分类:在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。
常用的块状元素有:
、
...、、
、、、、 、
- 、
- 、
- 、

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

HTML適合初學者學習,因為它簡單易學且能快速看到成果。 1)HTML的學習曲線平緩,易於上手。 2)只需掌握基本標籤即可開始創建網頁。 3)靈活性高,可與CSS和JavaScript結合使用。 4)豐富的學習資源和現代工具支持學習過程。

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML定義網頁結構,CSS負責樣式和佈局,JavaScript賦予動態交互。三者在網頁開發中各司其職,共同構建豐富多彩的網站。

GiteePages靜態網站部署失敗:404錯誤排查與解決在使用Gitee...

AnexampleOfAstartingTaginHtmlis,beginSaparagraph.startingTagSareEssentialInhtmlastheyInitiateEllements,defiteTheeTheErtypes,andarecrucialforsstructuringwebpages wepages webpages andConstructingthedom。

實現圖片點擊後周圍圖片散開並放大效果許多網頁設計中,需要實現一種交互效果:點擊某張圖片,使其周圍的...

HTML、CSS和JavaScript是Web開發的三大支柱。 1.HTML定義網頁結構,使用標籤如、等。 2.CSS控製網頁樣式,使用選擇器和屬性如color、font-size等。 3.JavaScript實現動態效果和交互,通過事件監聽和DOM操作。

網頁批註功能的Y軸位置自適應算法本文將探討如何實現類似Word文檔的批註功能,特別是如何處理批註之間的間�...
