css 宋体_Java前端基础(一)之html/css
1.1 html
HTML:超文本標(biāo)記語(yǔ)言(Hyper Text Markup Language)，標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用。HTML 不是一種編程語(yǔ)言，而是一種標(biāo)記語(yǔ)言 (markup language)，是網(wǎng)頁(yè)制作所必備的
WEB開發(fā)工具：hbuilder/webstorm/vs code/eclpise
最簡(jiǎn)單的HTML
<!DOCTYPE html> ---->告訴瀏覽器，當(dāng)前HTML語(yǔ)言使用的是第5個(gè)版本，2014年發(fā)布
<html> --->根標(biāo)簽，一般有2個(gè)標(biāo)簽，head，body標(biāo)簽
<head> --->head標(biāo)簽里的內(nèi)容一般不直接現(xiàn)實(shí)在頁(yè)面上，用來(lái)說(shuō)明和描述網(wǎng)頁(yè)文檔
<meta charset="utf-8" /> --->申明文檔使用的是UTF-8的編碼
<title></title> ---->說(shuō)明網(wǎng)頁(yè)標(biāo)題
</head>
<body> --->body標(biāo)簽放置真正顯示的內(nèi)容
</body>
</html>
標(biāo)簽：左右尖括號(hào)括起來(lái)的內(nèi)容就是標(biāo)簽。單標(biāo)簽和雙標(biāo)簽。雙標(biāo)簽是有起始和結(jié)束標(biāo)簽。
HTML常用標(biāo)簽
網(wǎng)頁(yè)內(nèi)容的標(biāo)題標(biāo)簽
H1,H2,H3...H6，都是網(wǎng)頁(yè)內(nèi)容的標(biāo)題標(biāo)題
<h1>標(biāo)題1</h1>
<h2>標(biāo)題2</h2>
<h6>標(biāo)題6</h6>
網(wǎng)頁(yè)注釋標(biāo)簽
<!--標(biāo)題標(biāo)簽-->
段落標(biāo)簽
<p>超文本標(biāo)記語(yǔ)言的結(jié)構(gòu)包括“頭”部分（英語(yǔ)：Head）、和“主體”部分（英語(yǔ)：Body），其中“頭”部提供關(guān)于網(wǎng)頁(yè)的信息，“主體”部分提供網(wǎng)頁(yè)的具體內(nèi)容。</p>
圖片標(biāo)簽
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558591161852&di=1bd06fab6bc654369456cf33bff60f07&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fblog%2F201410%2F21%2F20141021205157_j2TL2.thumb.700_0.jpeg"/>
最常用容器標(biāo)簽
<!--最常用的容器標(biāo)簽,因?yàn)閴K級(jí)標(biāo)簽，沒(méi)有其他多余的樣式-->
<div>hello</div>
鏈接標(biāo)簽
跳轉(zhuǎn)到淘寶
<a href="http://www.taobao.com">淘寶</a>
跳轉(zhuǎn)當(dāng)前頁(yè)面的某個(gè)地方
<a href="#跳轉(zhuǎn)到相對(duì)應(yīng)的元素的ID">主要作品</a>
1.2 列表
表單標(biāo)簽
form表單標(biāo)簽
action:將表單數(shù)據(jù)提交給什么服務(wù)器（服務(wù)器的地址）
method:get/post
get和post區(qū)別：get會(huì)將表單提交的內(nèi)容直接放在請(qǐng)求的URL地址里，效率高，不安全。post不會(huì)將表單數(shù)據(jù)顯示到url上，會(huì)放置在請(qǐng)求的body上。
搜索/正常的請(qǐng)求就會(huì)使用get
登陸/注冊(cè)等比較隱私和安全的內(nèi)容時(shí)候，就需要用到POST,上傳文件的時(shí)候也會(huì)用到post
input標(biāo)簽有多種類型
type=》
text（文本輸入）
password(密碼)
radio:單選框，注意單選框如果選擇的內(nèi)容是同一項(xiàng)內(nèi)容，那么多個(gè)輸入input標(biāo)簽的name值必須一致。
checkbox:復(fù)選框，選擇的內(nèi)容是同一項(xiàng)內(nèi)容，那么多個(gè)輸入input標(biāo)簽的name值必須一致
color:輸入顏色（少用）
date:時(shí)間標(biāo)簽（少用）
select>option
textarea：長(zhǎng)文本輸入標(biāo)簽
案例：
<!DOCTYPE html>1.3 css
層疊樣式表(英文全稱：Cascading Style Sheets)是一種用來(lái)表現(xiàn)HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)應(yīng)用）或XML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)子集）等文件樣式的計(jì)算機(jī)語(yǔ)言。
CSS使用
1、style屬性上直接使用
<h1 style="color:purple;">今晚吃什么？</h1>
<h1 style="color: greenyellow;">吃雞</h1>
2、Style標(biāo)簽上使用
語(yǔ)法：
<style type="text/css">
選擇器{樣式的內(nèi)容}
</style>
CSS常用選擇選擇器：
元素選擇器：元素名稱
Class選擇器：.+類名
ID選擇器：#+id名稱
3、Link標(biāo)簽引入css文件使用
<link rel="stylesheet" type="text/css" href="css/style.css"/>
優(yōu)先級(jí)情況
元素內(nèi)style屬性的優(yōu)先級(jí)>id>class>元素>默認(rèn)的瀏覽器樣式>繼承的樣式
越復(fù)雜的選擇器優(yōu)先級(jí)越高
備注：!Important,將樣式的優(yōu)先級(jí)提高到最高
文字
Color:文字顏色
Font-size:文字的大小
font-family:文字字體，盡量使用黑體，微軟雅黑，宋體，普通用戶都有的字體
Font-weight:字體粗細(xì),100-900,具體的粗細(xì)根據(jù)字體文件本身有什么粗細(xì)的字體來(lái)決定
Text-align:文字的排版，left,center,right
Line-height:行高，行與行之間的高度
Text-shadow:文字陰影
text-shadow: 0 0 10px orange,0 0 20px yellow;
Text-shadow:水平偏移值 垂直偏移值 陰影的模糊度 陰影的顏色，設(shè)置多個(gè)陰影用逗號(hào)隔開
容器盒子
Box-size:設(shè)置盒子模型
Width:寬度
Height:高度
Padding:內(nèi)邊距
Margin:外邊距
Border:邊框
Box-shadow:盒子陰影
Display:設(shè)置盒子是塊級(jí)元素還是行級(jí)元素還是彈性元素
Background:設(shè)置元素的背景，背景圖片，背景顏色
總結(jié)
以上是生活随笔為你收集整理的css 宋体_Java前端基础(一)之html/css的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： mysql mvcc 隔离级别_关于 M
- 下一篇： html框架有什么作用,使用HTML5+