日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問(wèn) 生活随笔!

生活随笔

當(dāng)前位置: 首頁(yè) > 编程资源 > 编程问答 >内容正文

编程问答

学习使我快乐 第十一天

發(fā)布時(shí)間:2024/1/18 编程问答 41 豆豆
生活随笔 收集整理的這篇文章主要介紹了 学习使我快乐 第十一天 小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

Day 011

前段三大技術(shù)

HTML:負(fù)責(zé)顯示頁(yè)面內(nèi)容(文字、按鈕、輸入框等)
CSS:負(fù)責(zé)頁(yè)面的布局和樣式
JavaScript:負(fù)責(zé)實(shí)現(xiàn)對(duì)應(yīng)功能

前端文件的后綴名:html、htm、shtml

html:現(xiàn)在最常用的前段文件后綴名。
htm:htm和html相等,從前DOS操作系統(tǒng)后綴名存在限制,長(zhǎng)度<=3
shtml:內(nèi)置了腳本命令的html文件

HTML簡(jiǎn)介

HTML文件理解為一個(gè)html標(biāo)簽,html標(biāo)簽里面包含head標(biāo)簽和body標(biāo)簽
head標(biāo)簽存放頁(yè)面部分配置項(xiàng),body標(biāo)簽顯示頁(yè)面內(nèi)容

html 標(biāo)簽分為雙標(biāo)簽(一般標(biāo)簽)、單標(biāo)簽(自閉合標(biāo)簽)
雙標(biāo)簽:<標(biāo)簽名 屬性1=屬性值1 屬性2=屬性值2 …></標(biāo)簽名>
單標(biāo)簽:<標(biāo)簽名 屬性1=屬性值1 屬性2=屬性值2 …>或者
<標(biāo)簽名 屬性1=屬性值1 屬性2=屬性值2 …/>

屬性=屬性值 ——>固定寫法,用于修改標(biāo)簽的內(nèi)容和樣式
標(biāo)簽名 ——> 固定寫法,不同的標(biāo)簽用于顯示不同的內(nèi)容,用法是固定的

html語(yǔ)法和Markdown語(yǔ)法屬于同一類

!DOCTYPE html 聲明為 HTML5 文檔。

html 元素是 HTML 頁(yè)面的根元素。

head 元素包含了文檔的元(meta)數(shù)據(jù),如 定義網(wǎng)頁(yè)編碼格式為 utf-8。

title 元素描述了文檔的標(biāo)題

body 元素包含了可見的頁(yè)面內(nèi)容

h1 元素定義一個(gè)大標(biāo)題

p 元素定義一個(gè)段落

<!-- 聲明這是一個(gè)html5文件 --> <!DOCTYPE html> <html><head><!-- charset用于頁(yè)面指定編碼 --><meta charset="utf-8" /><!-- 頁(yè)面的標(biāo)題 --><title></title></head><body></body> </html>

一、文本標(biāo)簽html

  • HTML 元素以開始標(biāo)簽起始
  • HTML 元素以結(jié)束標(biāo)簽終止
  • 元素的內(nèi)容是開始標(biāo)簽與結(jié)束標(biāo)簽之間的內(nèi)容
  • 某些 HTML 元素具有空內(nèi)容(empty content)
  • 空元素在開始標(biāo)簽中進(jìn)行關(guān)閉(以開始標(biāo)簽的結(jié)束而結(jié)束)
  • 大多數(shù) HTML 元素可擁有屬性

1.標(biāo)題標(biāo)簽h1、h2…h(huán)6

a.標(biāo)簽之間可以相互嵌套

<h1>我是一級(jí)標(biāo)題</h1><h2>我是二級(jí)標(biāo)題</h2><h3>我是三級(jí)標(biāo)題</h3><h4>我是四級(jí)標(biāo)題</h4><h5>我是五級(jí)標(biāo)題</h5><h6>我是六級(jí)標(biāo)題</h6>

2.段落與換行

a. 段落標(biāo)簽:p
b. 標(biāo)題標(biāo)簽和段落標(biāo)簽會(huì)自動(dòng)換行(一個(gè)標(biāo)簽代表一行或者一段,寫下一個(gè)標(biāo)簽的時(shí)候自動(dòng)另起一行 。
c. 換行:br
d. 水平線標(biāo)簽:hr

3.空格

a. html頁(yè)面敲任意個(gè)空格恒等于一個(gè)空格
b. html一個(gè)空格可以用下列兩種方式表示:&nbsp 或者&emsp
c. &nbsp表示一個(gè)像素單位(px)的空格
d. &emsp表示一個(gè)漢字的寬度一個(gè)&emsp=16個(gè)&nbsp

<p> 中新網(wǎng)7月5日電 國(guó)家衛(wèi)健委5日就健康中國(guó)行動(dòng)實(shí)施以來(lái)進(jìn)展與成效舉行發(fā)布會(huì),健康中國(guó)行動(dòng)推進(jìn)委員會(huì)辦公室副主任、國(guó)家衛(wèi)生健康委規(guī)劃司司長(zhǎng)毛群安在會(huì)上介紹稱,目前,我國(guó)人均預(yù)期壽命提高到77.93歲,主要健康指標(biāo)居于中高收入國(guó)家前列,《“健康中國(guó)2030”規(guī)劃綱要》2020年階段性目標(biāo)總體如期實(shí)現(xiàn),健康中國(guó)行動(dòng)2022年主要目標(biāo)提前實(shí)現(xiàn),健康中國(guó)建設(shè)開局起步良好、進(jìn)展順利,為我國(guó)全面建成小康社會(huì)、推動(dòng)“十四五”經(jīng)濟(jì)社會(huì)發(fā)展發(fā)揮了重要作用。</p><p>毛群安指出,健康中國(guó)行動(dòng)實(shí)施取得了明顯的階段性成效:</p>

4.文字的特殊表現(xiàn)方式

a.傾斜標(biāo)簽:i,em。
b. 加租標(biāo)簽:b,strong。

<i><b>文字傾斜又加粗</b></i><b><i>文字傾斜又加粗</i></b><em>文字傾斜</em><strong>文字加粗</strong>

5.行內(nèi)文本標(biāo)簽:span

<span>我的京東</span> | <span>京東會(huì)員</span> | <span>登陸&nbsp;注冊(cè)</span><h1><b><i>一級(jí)加粗傾斜標(biāo)簽</i></b></h1><b><b> 雙層加租 </b></b>

二、超鏈接和圖片

1.圖片標(biāo)簽:img

  • src:1.可以寫入鏈接2.可以寫本地圖片路徑
  • alt:當(dāng)圖片不顯示時(shí),顯示文字
  • title:鼠標(biāo)放在圖標(biāo)上面可以提示文字
  • width、heihet:能夠修改圖片、標(biāo)簽盒子等的顯示寬度和高度
<img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" alt="百度"title="點(diǎn)擊一下,了解更多"><img src="./img/程序員.jpg" alt="程序員" title="單身狗" width="100px" heigt="250">

2. 超鏈接標(biāo)簽:a

href:

  • 引入在線鏈接
  • 引入本地文件(必須是html文件)
  • 可以引入id選擇器

target:

  • ._self:當(dāng)前標(biāo)簽頁(yè)跳轉(zhuǎn)(默認(rèn))
  • _target:新的標(biāo)簽頁(yè)跳轉(zhuǎn)
<a href="https://www.baidu.com"target="_blank">百度一下</a><a href="./01-文本標(biāo)簽.html">文本標(biāo)簽</a><!-- 將圖片或文字變?yōu)榭牲c(diǎn)擊的超鏈接 --><a href="https://yrzx.qq.com/act/2890/a20200518xz/index.html"target="_blank"><img src="https://game.gtimg.cn/images/ulink/act/2890/a20200518xz/bg-kv1.jpg" alt="一人之下" title="單身狗" width="200px" heigt="100"><p>一人之下手游</p></a>

3. 用id選擇器頁(yè)面跳轉(zhuǎn)

  • id屬性如何調(diào)用:使用#號(hào)調(diào)用id屬性
  • 例:例如我在頂部設(shè)置一個(gè)一級(jí)標(biāo)題并且寫入id 在底部設(shè)置id 選擇器,輸入頂部id進(jìn)行跳轉(zhuǎn)。
<h1 id = "top">頂部</h1><!-- n多內(nèi)容 --><a href="#top"><img src="./img/回頂部.jpg" alt="返回頂部" title="返回頂部"width="50px" heigt="50px"> </a>
  • 使用此方法可以設(shè)置中部底部,與上同理。

三、列表和內(nèi)聯(lián)框架

1.內(nèi)聯(lián)框架

  • iframe:內(nèi)聯(lián)框架 。
  • iframe:經(jīng)常被用在登錄、注冊(cè)頁(yè)面 。
  • 可用width 、 height 對(duì)其進(jìn)行頁(yè)面大小的調(diào)整。
<iframe src="https://www.bilibili.com/" width = "1700px"h height="500px" ></iframe>

2.列表

  • 列表:有序列表ol、無(wú)序列表 ul
  • 列表中的內(nèi)容放在 li
  • 列表在網(wǎng)站中主要用來(lái)做下拉菜單和展示同一類內(nèi)容
<ul><p>千峰成都校區(qū)科學(xué)一覽</p><li>Java</li><li>前端</li><li>Python</li><li>UI</li><li>物聯(lián)網(wǎng)</li></ul><ol><p>千峰成都校區(qū)科學(xué)一覽</p><li>Java</li><li>前端</li><li>Python</li><li>UI</li><li>物聯(lián)網(wǎng)</li> </ol>

四、input標(biāo)簽

1.input

  • input:默認(rèn)是一個(gè)文本框,但是通過(guò)修改type的屬性值可以將input構(gòu)造成不同的形式
  • placeholder:輸入框中的提示性文字
  • maxlength:限制輸入內(nèi)容的長(zhǎng)度
  • value:當(dāng)input變?yōu)榘粹o時(shí),在按鈕上顯示文字
<span>賬號(hào):</span><input type="text" placeholder="請(qǐng)輸入賬號(hào)" ><br><span>密碼:</span><input type="password" placeholder="請(qǐng)輸入密碼"maxlength="5"><input type="submit" value="登錄"><br>

可改變類型

<input type="color"><input type="file"><input type="date"><input type="time"><br><input type="datetime-local">

2.單選框

  • radio:單選框。
  • name:告訴系統(tǒng),兩個(gè)單選框?qū)儆谕活悺?/li>
  • 將單選框中的id屬性值設(shè)置為和lable標(biāo)簽中的for 屬性值想同,表示相關(guān)聯(lián)。
<input type="radio" name = "gender" id=gender1><label for="gender1"></label><input type="radio" name = "gender" id=gender2><label for="gender2"></label><br><input type="radio" name="測(cè)評(píng)" id="1"><label for="1">非常優(yōu)秀</label><input type="radio" name="測(cè)評(píng)" id="2"><label for="2">優(yōu)秀</label>

3.多選框

  • checkbox:復(fù)選框,可多選。
<p>今晚吃啥</p><input type="checkbox"name="food"id="one"><label for="one">面條</label><input type="checkbox"name="food"id="two"><label for="tow">炒菜</label><input type="checkbox"name="food"id="three"><label for="three">火鍋</label><input type="checkbox"name="food"id="four"><label for="four">水餃</label>

總結(jié)

以上是生活随笔為你收集整理的学习使我快乐 第十一天的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。