成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JavaWEB開發(fā)01——HTML

IntMain / 793人閱讀

摘要:網(wǎng)站信息頁面需求分析我們公司的需要一個(gè)對(duì)外宣傳的網(wǎng)站介紹介紹公司的主要業(yè)務(wù)公司的發(fā)展歷史公司的口號(hào)等等信息技術(shù)分析概述超文本標(biāo)記語言超文本比普通文本功能更加強(qiáng)大可以添加各種樣式標(biāo)記語言通過一組標(biāo)簽來對(duì)內(nèi)容進(jìn)行描述關(guān)鍵字是由瀏覽器來解釋執(zhí)行靜

1.網(wǎng)站信息頁面 1.1需求分析:

我們公司的需要一個(gè)對(duì)外宣傳的網(wǎng)站介紹,介紹公司的主要業(yè)務(wù),公司的發(fā)展歷史,公司的口號(hào)等等信息

1.2技術(shù)分析:
HTML概述:

HTML: Hyper Text Markup Language 超文本標(biāo)記語言

超文本: 比普通文本功能更加強(qiáng)大,可以添加各種樣式

標(biāo)記語言: 通過一組標(biāo)簽.來對(duì)內(nèi)容進(jìn)行描述. <關(guān)鍵字> , 是由瀏覽器來解釋執(zhí)行

靜夜詩

--李白

床前明月光,

地上鞋兩雙,

舉頭望明月,

低頭思故鄉(xiāng).

為什么要學(xué)習(xí)HTML:

生活所迫,今天的課程,群英妹子不讓回家.

HTML的主要作用:

設(shè)計(jì)網(wǎng)頁的基礎(chǔ),HTML5

HTML語法規(guī)范

1.3步驟分析:

公司簡介 需要標(biāo)題

水平分割線

四個(gè)段落

第一個(gè)段落字體需要紅色

1.4代碼實(shí)現(xiàn):

    
        
        網(wǎng)站信息頁面
    
    
        
        

公司簡介

一直以來,騰訊科技以技術(shù)視角關(guān)注IT產(chǎn)業(yè)發(fā)展,以深度分享推進(jìn)產(chǎn)業(yè)技術(shù)成長,致力于弘揚(yáng)技術(shù)創(chuàng)新,倡導(dǎo)分享、 開放和協(xié)作,努力打造高質(zhì)量的IT人才服務(wù)平臺(tái)。

1.5 擴(kuò)展內(nèi)容

? b : 加粗

? i : 斜體

? strong: 加粗, 帶語義標(biāo)簽

 em:  斜體, 帶語義
2.網(wǎng)站圖片信息 2.1需求分析:

在我們的網(wǎng)站中通常需要顯示LOGO圖片,顯示效果如下

2.2技術(shù)分析

img 標(biāo)簽:

? 常用的屬性;

? width : 寬度

? height: 高度

? src : 指定文件路徑

? alt: 圖片加載失敗時(shí)的提示內(nèi)容

2.3步驟分析 2.4代碼實(shí)現(xiàn)


    
        
        
    
    
        
        
    





    
        
        
    
    
        
        
        
    
2.5 擴(kuò)展-文件路徑

相對(duì)路徑

        ./        代表的是當(dāng)前路徑
        ../     代表的上一級(jí)路徑
        ../../    上上一級(jí)路徑
3.網(wǎng)站友情鏈接頁面 3.1需求分析

在我們的網(wǎng)站中,通常會(huì)顯示友商公司的網(wǎng)站鏈接

百度

新浪微博

黑馬程序員

3.2技術(shù)分析

列表標(biāo)簽:
? 無序列表: ul

? type: 小圓圈,小圓點(diǎn), 小方塊

? 有序列表: ol

? type: 1,a ,A,I,

? start : 指定是起始索引

3.3步驟分析 3.4代碼實(shí)現(xiàn)


    
        
        
    
    
    
        
    
3.5 擴(kuò)展內(nèi)容

? 點(diǎn)擊鏈接,跳轉(zhuǎn)去指定網(wǎng)站
? a 超鏈接標(biāo)簽
? 常用的屬性:
? href: 指定要跳轉(zhuǎn)去的鏈接地址
? 如果是網(wǎng)絡(luò)地址需要加上http協(xié)議 ,
? 如果訪問的是本網(wǎng)站的html文件,可以直接寫文件路徑
? target : 以什么方式打開

? _self: 默認(rèn)打開方式,在當(dāng)前窗口打開

? _blank: 新起一個(gè)標(biāo)簽頁打開頁面

上午內(nèi)容回顧:

網(wǎng)站信息案例

字體標(biāo)簽 font

color: 顏色

size: 大小 1~7

face: 改變字體

p 段落標(biāo)簽

h標(biāo)題標(biāo)簽 : 1~6

br 換行

hr 水平線

b 加粗

i 斜體

strong : 加粗 包含語義

em : 斜體 包含語義

網(wǎng)站圖片案例

img標(biāo)簽

src : 指定圖片的路徑

width: 寬度

height: 高度

alt : 圖片加載錯(cuò)誤時(shí)的提示信息

相對(duì)路徑:

./ 代表的是當(dāng)前路徑

../ 代表的上一級(jí)路徑

../../ 代表的上上一級(jí)路徑

友情鏈接:

ul: 無序列表

type :

ol: 有序列表

type : 樣式

start : 起始索引

li : 列表項(xiàng)

a 超鏈接標(biāo)簽

href : 要訪問的鏈接地址

target : 打開方式

網(wǎng)站首頁

table標(biāo)簽

border: 指定邊框

width : 寬度

height : 高度

bgcolor : 背景顏色

align : 對(duì)齊方式

tr標(biāo)簽

td標(biāo)簽

colspan: 跨列操作

rowspan: 跨行操作

表格單元格的合并

表格的嵌套

4.網(wǎng)站首頁 4.1需求分析:

? 根據(jù)產(chǎn)品文檔,完成商城首頁,顯示效果如圖:

4.2技術(shù)分析:
表格標(biāo)簽table

? table標(biāo)簽:
? 常用的屬性:
? bgcolor : 背景色
? width : 寬度
? height : 高度
? align : 對(duì)齊方式
? tr 標(biāo)簽
? td 標(biāo)簽

合并單元格:

? colspan : 跨列操作
? rowspan : 跨行操作
? 注意: 跨行或者跨列操作之后,被占掉的格子需要?jiǎng)h除掉

表格的嵌套:

? 在td中可以嵌套一個(gè)表格

4.3步驟分析

創(chuàng)建一個(gè)8行一列的表格

第一部份: LOGO部分: 嵌套一個(gè)一行三列的表格

第二部分: 導(dǎo)航欄部分 : 放置5個(gè)超鏈接

第三部分: 輪播圖

第四部分: 嵌套一個(gè)三行7列表格

第五部分: 直接放一張圖片

第六部分: 抄第四部分的

第七部分: 放置一張圖片

第八部分: 放一堆超鏈接

4.4代碼實(shí)現(xiàn)


    
        
        
        
    
    
        
        
登錄 注冊(cè) 購物車
首頁 手機(jī)數(shù)碼 鞋靴箱包 電腦辦公 香煙酒水

最新商品

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

熱門商品

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

洗衣機(jī)

$998

關(guān)于我們 聯(lián)系我們 招賢納士 法律聲明 友情鏈接 支付方式 配送方式 服務(wù)聲明 廣告聲明
Copyright ? 2005-2016 傳智商城 版權(quán)所有
5.網(wǎng)站注冊(cè)頁面: 5.1需求分析:

? 編寫一個(gè)HTML頁面, 顯示效果如圖所示

5.2技術(shù)分析:

表單標(biāo)簽

表單標(biāo)簽
    action : 直接提交的地址
    method : 
            get 方式  默認(rèn)提交方式 ,會(huì)將參數(shù)拼接在鏈接后面 , 有大小限制 ,4k
            post 方式  會(huì)將參數(shù)封裝在請(qǐng)求體中, 沒有這樣的限制
input :
    type: 指定輸入項(xiàng)的類型
        text : 文本
        password :  密碼框
        radio :        單選按鈕
        checkbox :  復(fù)選框
        file      : 上傳文件
        submit   : 提交按鈕
        button      : 普通按鈕
        reset     : 重置按鈕
        hidden  : 隱藏域

        date    : 日期類型
        tel     : 手機(jī)號(hào)
        number   : 只允許輸入數(shù)字

    placeholder : 指定默認(rèn)的提示信息
    name : 在表單提交的時(shí)候,當(dāng)作參數(shù)的名稱
    id : 給輸入項(xiàng)取一個(gè)名字, 以便于后期我們?nèi)フ业剿?并且操作它

textarea : 文本域, 可以輸入一段文本
            cols : 指定寬度
            rows : 指定的是高度

select  : 下拉列表
option : 選擇項(xiàng)
步驟分析:

logo部分

導(dǎo)航欄

注冊(cè)部分

頁腳圖片

網(wǎng)站聲明信息

5.3代碼實(shí)現(xiàn):
會(huì)員注冊(cè) USER REGISTER
用戶名:
密 碼:
確認(rèn)密碼:
email:
姓名:
性別:
出生日期:
驗(yàn)證碼:
6.網(wǎng)站后臺(tái)頁面展示 6.1需求分析:

我們前面已經(jīng)做完了首頁商品展示, 那么我們需要一個(gè)頁面用來編輯我們的商品信息, 還有商品分類, 用戶購買之后,還得有訂單管理頁面

6.2技術(shù)分析

框架標(biāo)簽:
frameset
注意: 使用了frameset必須將body刪掉,否則頁面會(huì)有問題
frame

 常用屬性:

? src: 引入的html文件路徑
? name: 指定框架的名稱

6.3步驟分析 6.4代碼實(shí)現(xiàn) 擴(kuò)展

框架中點(diǎn)擊跳轉(zhuǎn)

常用的快捷鍵
Ctrl + D                     刪除光標(biāo)當(dāng)前所在的行
Ctrl + Shift + R             復(fù)制當(dāng)前行到下一行
Ctrl + Enter                 將光標(biāo)移動(dòng)到下一行
Ctrl + Shift + Enter         將光標(biāo)定位在上一行
Ctrl + Shift + /            注釋當(dāng)前行
Ctrl + R                      運(yùn)行當(dāng)前網(wǎng)頁/刷新當(dāng)前網(wǎng)頁

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/53104.html

相關(guān)文章

  • ueditor筆記

    摘要:下載完后的包三將集成到項(xiàng)目第一步新建一個(gè)項(xiàng)目,并把引入到項(xiàng)目中。項(xiàng)目中配置其它上傳其它上傳如視頻上傳等等參考圖片上傳,修改即可。一、ueditor是什么 UEditor 是由百度「FEX前端研發(fā)團(tuán)隊(duì)」開發(fā)的所見即所得富文本web編輯器,具有輕量,可定制,注重用戶體驗(yàn)等特點(diǎn),開源基于MIT協(xié)議,允許自由使用和修改代碼。 二、ueditor的下載 下載網(wǎng)址:https://ueditor.ba...

    番茄西紅柿 評(píng)論0 收藏0
  • JavaWeb】客戶關(guān)系管理系統(tǒng)

    摘要:前言為了鞏固開發(fā)的流程,我們?cè)倌靡粋€(gè)客戶關(guān)系管理系統(tǒng)來練手成果圖我們完成的就是下面的項(xiàng)目搭建配置環(huán)境配置導(dǎo)入開發(fā)包建立開發(fā)用到的程序包在數(shù)據(jù)庫創(chuàng)建相對(duì)應(yīng)的表開發(fā)實(shí)體開發(fā)實(shí)體十分簡單,對(duì)照著數(shù)據(jù)庫的表就行了各種開發(fā)獲取數(shù)據(jù)庫連接池的導(dǎo)入配置文 前言 為了鞏固開發(fā)的流程,我們?cè)倌靡粋€(gè)客戶關(guān)系管理系統(tǒng)來練手...! 成果圖 我們完成的就是下面的項(xiàng)目! showImg(https://segm...

    Arno 評(píng)論0 收藏0
  • 深入分析JavaWeb Item1 -- JavaWeb開發(fā)入門

    摘要:中主要是使用語言。將的動(dòng)態(tài)功能和標(biāo)準(zhǔn)的安全性引入大型網(wǎng)絡(luò)應(yīng)用的開發(fā)集成部署和管理之中。提供了一個(gè)圖形界面的管理工具,稱為信息服務(wù)管理器,可用于監(jiān)視配置和控制服務(wù)。 一、基本概念 1.1、WEB開發(fā)的相關(guān)知識(shí)   WEB,在英語中web即表示網(wǎng)頁的意思,它用于表示Internet主機(jī)上供外界訪問的資源。  Internet上供外界訪問的Web資源分為: 靜態(tài)web資源(如html 頁面...

    tinna 評(píng)論0 收藏0
  • JavaWeb從0開始學(xué)(一)-----第一個(gè)Web應(yīng)用程序與JSP工作原理

    摘要:當(dāng)后繼請(qǐng)求相同的頁面時(shí),容器加載之前生成的類,并且通知去執(zhí)行已經(jīng)存在的字節(jié)碼,從而省去了轉(zhuǎn)換的過程,這也是第一次執(zhí)行頁面時(shí)間較長的原因。 以往學(xué)習(xí)的時(shí)候大多是看完書或者看完視頻,動(dòng)手實(shí)踐一下就OK了。然而過了一段時(shí)間我發(fā)現(xiàn)東西都忘差不多了,需要復(fù)習(xí)才能重新掌握?,F(xiàn)在開始學(xué)習(xí)JavaWeb了,我將在這里記錄自己的學(xué)習(xí)的一點(diǎn)一滴,不僅便于自己以后回顧知識(shí)點(diǎn),也希望能對(duì)JavaWeb初學(xué)者有...

    CloudDeveloper 評(píng)論0 收藏0
  • 基于javaweb+jsp的學(xué)生成績管理系統(tǒng)

    基于javaweb+jsp的學(xué)生成績管理系統(tǒng) JavaWeb JavaBean JSP MVC MySQL Tomcat JavaScript idea eclipse MyEclipse Servlet SSM Maven … 部分代碼實(shí)現(xiàn)JSP let editIndex = layedit.build('LAY_demo_editor'); ...

    番茄西紅柿 評(píng)論0 收藏2637

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<