1.作業(yè)
1.分別說出什么是HTML,XHTML,HTML5?
答:HTML為超文本標(biāo)記語言,它不是一種編程語言而是一種標(biāo)記語言,使用標(biāo)記標(biāo)簽來描述網(wǎng)頁;
XHTML為一種編碼更加規(guī)范,對(duì)于機(jī)器的識(shí)別更為友善,可以說是HTML的繼承者,但要比其更加規(guī)范,例如行頭加<!doctype html>這就是一種聲明,瀏覽器會(huì)根據(jù)你的定義來解釋頁面代碼;
HTML5是對(duì)HTML的第五次修訂,其主要的目標(biāo)是將互聯(lián)網(wǎng)語義化,以便更好地被人類和機(jī)器閱讀,并同時(shí)提供更好地支持各種媒體的嵌入。
2.寫出HTML的語法
答:以下為最基本的HTML的語法結(jié)構(gòu),其還可以與css和javascript配合使用。
<html>
<head>
<title>名字</title>
</head>
<body>
內(nèi)容
</body>
</html>
3.HTML中的注釋和CSS中的注釋
答:
HTML:<!--注釋內(nèi)容 -->
CSS:/*注釋內(nèi)容*/
4.CSS中的引入方式有哪些?說出他們的區(qū)別和語法
答:CSS有三種引入方式根據(jù)樣式表的位置可分為行間樣式表,內(nèi)部樣式表,外部樣式表。行間樣式表是直接寫在<body>與</body>之間的,編寫較為麻煩繁瑣,無法一次性更改所有變量,給寫程序的人帶來了極大
的不便。而內(nèi)部樣式表是把<style></style>放入head部分,通過ID來將樣式表引入,此方法較方便快捷,程序更加鮮明整齊。外部樣式表是通過一個(gè)鏈接來將外部的CSS文件直接作用在HTML文件上,對(duì)內(nèi)容進(jìn)行定義。外部樣式表:
引入外部CSS文件
<link rel="stylesheet" type="text/css" href="my.css"/>
內(nèi)部樣式表:
<style>
#id {width:100px height:100px background:red }
</style>
行間樣式表:
<div style="weidth:100px height:100px background:red "></div>
5.背景圖片有哪些子屬性?
答:背景圖片則子屬性分別為background image為圖片的鏈接位置,background color為背景的顏色,background repeat為背景圖片的重復(fù),background position為背景圖片的定位,Background-attachment為背景圖片的固定。
6.Border有哪些子屬性 其中border-style的屬性值有哪些?
答:border-style:solid; 邊框樣式
border-width:1px 2px 3px 4px; 邊框的線條寬度
border-color 邊框的線條顏色
solid:?jiǎn)螌?shí)線。
double:雙實(shí)線。
dashed:虛線。
dotted:點(diǎn)線。
groove:溝線(groove)。
ridge:脊線(ridge)。
inset:內(nèi)陷邊框。
outset:外凸邊框。
none:無邊框。
7.什么是CSS ?
答:CSS就是一種叫做層疊樣式表(Cascading Stylesheet)的技術(shù)。 在主頁制作時(shí)采用CSS技術(shù),可以有效地對(duì)頁面的布局、字體、顏色、背景和其它效果實(shí)現(xiàn)更加精確的控制。 只要對(duì)相應(yīng)的代碼做一些簡(jiǎn)單的修改,就可以改變同一頁面的不同部分,或者頁數(shù)不同的網(wǎng)頁的外觀和格式。 CSS不僅可以靜態(tài)地修飾網(wǎng)頁,還可以配合各種腳本語言動(dòng)態(tài)地對(duì)網(wǎng)頁各元素進(jìn)行格式化。CSS 能夠?qū)W(wǎng)頁中元素位置的排版進(jìn)行像素級(jí)精確控制,支持幾乎所有的字體字號(hào)樣式,擁有對(duì)網(wǎng)頁對(duì)象和模型樣式編輯的能力。
8.你知道的CSS屬性有哪些?
答:字體屬性(Font) font-style font-weight font-size 顏色和背景屬性Background-color Background-image Background-repeat Background-attachment Background-position 邊框?qū)傩?Border-top-width Border-right-width Border-bottom-width Border-left-width Border-width Border-color Border-style Border-top Border-right Border-bottom Border-left 。以上是我目前為止通過視頻學(xué)習(xí)到的,大部分我都動(dòng)手敲過驗(yàn)證其作用。
9.什么是W3C標(biāo)準(zhǔn)?
答:W3C是英文 World Wide Web Consortium 的縮寫,中文意思是W3C理事會(huì)或萬維網(wǎng)聯(lián)盟。W3C于1994年10月在麻省理工學(xué)院計(jì)算機(jī)科學(xué)實(shí)驗(yàn)室成立。創(chuàng)建者是萬維網(wǎng)的發(fā)明者TiM。W3C組織(是對(duì)網(wǎng)絡(luò)標(biāo)準(zhǔn)制定的一個(gè)非贏利組織,像HTML、XHTML、CSS、XML的標(biāo)準(zhǔn)就是由W3C來定制。W3C會(huì)員(大約500名會(huì)員)包括生產(chǎn)技術(shù)產(chǎn)品及服務(wù)的廠商、內(nèi)容供應(yīng)商、團(tuán)體用戶、研究實(shí)驗(yàn)室、標(biāo)準(zhǔn)制定機(jī)構(gòu)和政府部門,一起協(xié)同工作,致力在萬維網(wǎng)發(fā)展方向上達(dá)成共識(shí)。(此段引用百度)
10.常見的瀏覽器都有哪幾種,五大瀏覽器內(nèi)核分別是什么?
答:IE瀏覽器,火狐瀏覽器,谷歌瀏覽器,蘋果瀏覽器等。
1.Chromium內(nèi)核,以Chrome為代表
2.Gecko內(nèi)核,以Firefox為代表
3.Presto內(nèi)核,以老版本的Opera為代表
4.Webkit內(nèi)核,以Sarfari為代表
5.Trident內(nèi)核,以IE為代表
2.感想
這短短兩天的學(xué)習(xí)讓我感受到自從我上大學(xué)以來再也沒有過得學(xué)習(xí)的熱情以及對(duì)于學(xué)習(xí)的滿足感。我知道了什么是HTML,什么是CSS,什么是Javascript,什么是網(wǎng)頁設(shè)計(jì)師,我懂得了樣式表與腳本的神奇,我知道那花花綠綠的網(wǎng)頁設(shè)計(jì)與制作的不易,我終于用到了慕名已久的Photoshop,學(xué)會(huì)了摳圖。這兩天,特別是第二天,我一直坐在電腦前,我終于知道我眼前的被稱為計(jì)算機(jī)的機(jī)器真的不只是我用來打游戲的游戲機(jī),這兩天我甚至連我一直不間斷的首勝也停了,因?yàn)槲乙庾R(shí)到這臺(tái)機(jī)器對(duì)我的意義,他很可能就是我以后吃飯的工具,是我發(fā)揮人生價(jià)值的平臺(tái)。坐在電腦前我深刻感受到要想學(xué)習(xí)程序,學(xué)習(xí)web開發(fā)最必不可少的就是練習(xí),老師講的再好自己不多練兩遍,東西還是老師的,你只是認(rèn)可了老師的思維與知識(shí)并沒有真正學(xué)成自己的東西,坐在板凳前望著屏幕上大段大段等著你去填寫的空白,終究也只是一臉茫然。只有經(jīng)過無數(shù)次的練習(xí)才能有那剎那間靈感的迸發(fā)。
對(duì)于這兩天的學(xué)習(xí)我有一些疑問:
1,我一直學(xué)的是圖片,邊框之類的設(shè)計(jì),對(duì)于網(wǎng)頁上稀奇古怪的文字效果有沒有一些特別的技術(shù)來完成?
2.在我進(jìn)行視頻學(xué)習(xí)的時(shí)候,聽老師說了一句網(wǎng)頁里的flash動(dòng)畫,我想知道網(wǎng)頁內(nèi)的光怪陸離的廣告FLASH動(dòng)畫是不是也要掌握,應(yīng)該如何學(xué)習(xí)?
3.我在使用Photoshop摳圖時(shí)發(fā)現(xiàn)在虛線框選中之后按住Alt鍵進(jìn)行放大操作時(shí),虛線框偏離了之前的選中范圍,我知道他其實(shí)沒動(dòng),但給人的感覺是圖片在放大而選中其中一部分的虛線框卻并沒有隨之放大,我不知道是不是我操作上有什么問題,但對(duì)我造成了很大的困擾。
4.我在使用Photoshop時(shí)發(fā)現(xiàn)有些圖片其邊框顏色極淡,很難分辨出來并進(jìn)行選中,我的眼睛都瞅流淚了,有什么辦法可以輕松將圖片的各個(gè)部位展現(xiàn)出來,而不是用眼睛很辛苦的看。
最后對(duì)于一直幫助我解答問題的十七點(diǎn)網(wǎng)的同學(xué)與老師表示感謝,其中一個(gè)還幫我檢查出;與:的錯(cuò)誤,我自己檢查了一個(gè)多小時(shí)都沒檢查出來,都快放棄了,再次感謝!
附上一個(gè)我做的百度側(cè)邊欄。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔</title>
<style>
#box
{
width: 134px;
height: 1015px;
}
#title
{
width:134px;
height:79px;
border-bottom:solid #f0f0f0 2px;
background: url(0.gif) #f9f9f9 no-repeat 15px 19px
}
#content-1
{
width:134px;
height:152px;
border-bottom:solid #f0f0f0 2px;
background:url(1.gif) #f9f9f9 no-repeat 27px 41px;
}
#content-2
{
width:134px;
height:152px;
border-bottom:solid #f0f0f0 2px;
background:url(d2.gif) #f9f9f9 no-repeat 36px 27px;
}
#content-3
{
width:134px;
height:152px;
border-bottom:solid #f0f0f0 2px;
background:url(3.gif) #f9f9f9 no-repeat 31px 20px;
}
#content-4
{
width:134px;
height:152px;
border-bottom:solid #f0f0f0 2px;
background:url(4.gif) #f9f9f9 no-repeat 36px 20px;
}
#content-5
{
width:134px;
height:152px;
border-bottom:solid #f0f0f0 2px;
background:url(5.gif) #f9f9f9 no-repeat 31px 25px;
}
#content-6
{
width:134px;
height:152px;
border-bottom:solid #f0f0f0 2px;
background:url(6.gif) #f9f9f9 no-repeat 34px 23px;
}
#content-7
{
width:134px;
height:10px;
background:#f9f9f9;
}
</style>
</head>
<body>
<div id="box">
<div id="title"> </div>
<div id="content-1"></div>
<div id="content-2"></div>
<div id="content-3"></div>
<div id="content-4"></div>
<div id="content-5"></div>
<div id="content-6"></div>
<div id="content-7"></div>
</div>
</body>
</html>
鏈接: http://pan.baidu.com/s/1jHF7LNC 密碼: 83fr