9月9日HTML上午表單元素2(框架 樣式表)

2022-07-04 19:00:16 字數 4460 閱讀 8245

五、框架

1.frameset是雙標籤框架集,如果使用框架集,當前頁面不能有body。

frameset屬性:①cols代表左右拆分。cols=「300,*」表示左邊框架寬300,右邊寬剩餘的寬度。*代表剩餘。

②rows代表上下拆分。rows=「300,*」表示上邊框架高300,下邊框架高剩餘的高度。

③frameborder邊框,有邊框就設定為1( frameborder="1"),沒有邊框就設定為( frameborder="0")。

④屬性有a:src 邊框要顯示的頁面的位址;b: scrolling滾動條,有滾動條就設定成yes(scrolling="yes"),沒有滾動條就設定成                                                no(scrolling="no")。

<

frameset

cols

="300,#"

>

<

frame

src="樣式1.css"

/>

<

frame

src="樣式2.css"

/>

frameset

>

2.iframe 可以嵌在普通頁面裡面,其屬性中的src表示框架裡面要顯示的頁面的位址。

src的屬性:①width框架的寬度

②height頁面的高度

③frameborder邊框,有邊框就設定為1( frameborder="1"),沒有邊框就設定為( frameborder="0")。

④scrolling 滾動條,有滾動條就設定成yes(scrolling="yes"),沒有滾動條就設定成no(scrolling="no")。

如果嵌入的頁面src屬性中設定成「width=0    height=0」,則嵌入的頁面就看不到了,但是實際上是存在的。

3.其它

①雙標籤,表示滾動效果。滾動字條。屬性有表示從左向右滾動,同樣的right可以換成right、up、down,分別表示從右到左、從下到上、從上到下滾動。加入,也可以和字型一樣滾動。

②做標記,字型,中間的「字型」就被做了標記,顏色變成了黃色。元素中顏色不可以更改。

③做分割線。網頁上出現一條分割線。

c.複製html**  複製flash   複製通用**

d.把複製的**貼上在頁面裡面

樣式表

樣式表的作用:樣式表的作用是配合標籤對網頁進行美化,標籤把內容放到頁面裡面,然後樣式去操作標籤,是網頁更加漂亮。樣式表分為內聯、內嵌、外部三種。

一、內聯:樣式寫在標籤裡面,

。可以具體到每個**,但是每個控制**都要寫上。優點:控制精確      缺點:**重用性差。

二、內嵌:嵌在頁面裡面,一般嵌在裡面。

>無標題文件

title

>

<

style

type

="text/css"

>

樣式style

>

head

>

樣式表裡面的注釋語法為/*樣式*/。缺點:控制不精確   優點:**重用性好。

三、外部:樣式表在網頁的外部,有乙個單獨的檔案。如果網頁的所有控制的樣式都是寫在另乙個檔案裡面的,則另乙個檔案就成為外部樣式表。使用時要把外部樣式表引入到網頁檔案裡。引入方法為:引入:網頁檔案空白處點選右鍵-css樣式表-附加樣式表。缺點:控制沒有內聯的精確    優點:**重用性最好(乙個外部樣式表可以用在n個網頁上)。

一般樣式表不要寫內聯的,**太多、太亂,除非有特殊情況要寫。後期主要用外部的。其中,內聯優先順序最高。

四、選擇器

選擇器就是樣式表用來選取元素的。

1.標籤選擇器     根據標籤名選擇元素。  

<

style

type

="text/css"

>

divstyle

>

head

>

<

body

>

<

div>123

div>

<

div>456

div>

<

span

>789

span

>

div表示找到的標籤是123

和 456

。只有這兩行顯示顏色#c93

2.class選擇器     class稱為類,選取一類的元素。class每個元素的屬性都有。                    

<

style

type

="text/css"

>

div.a

style

>

head

>

<

body

>

<

div

class

="a"

>123

div>

<

div>456

div>

<

span

class

="a"

>789

span

>

class=「a」表示兩行都為a類,class選擇器根據class名就把這兩行歸為a類。123

和789兩行顏色成為了顏色#f00。 .a=class a,。

3.id選擇器   用來精確控制,對要選擇的元素命名唯一的id,id選擇器找到這個元素(通過id來尋找)主要是內嵌和外聯中使用。class每個元素的屬性都有。通過id選擇器尋找元素只能找到乙個元素,因為id是唯一的。id選擇器的符號是#。例如下列**, 456

的id=d,尋找時#d。        

<

style

type

="text/css"

>

div.a

#dstyle

>

head

>

<

body

>

<

div

class

="a"

>123

div>

<

div

id="d"

>456

div>

<

span

class

="a"

>789

span

>

4.復合選擇器

①逗號並列選擇器,用逗號隔開表示是並列的。下列**同時選擇了div和span。

<

style

type

="text/css"

>

div,span

style

>

head

>

<

body

>

<

div

class

="a"

>123

div>

<

div

id="d"

>456

div>

<

span

class

="a"

>789

span

>

②空格後代   下列**表示找到的是4行中的數字。

#list li

style

>

head

>

<

body

>

<

ul id

="list"

>

<

li>11

li>

<

li>22

li>

<

li>33

li>

<

li>44

li>

<

ul>

③點篩選

div.s代表篩選 22222

<

div>11111

div>

<

div

class

="s"

>22222

div>

<

div>33333

div>

篩選優先等級為   id(優先順序高),clss(優先順序其次),標籤(優先順序最低)。

表單賦值 HTML入門2表單元素

1.type text 即表示文字框,不需要寫成或,這樣,包含 size value placeholder 背景文字文字框 等屬性,但框裡的內容只能輸一行,想要多行輸入,需要使用文字域。初始示例 type text 屬性size示例 type text size 10 屬性value示例 type...

HTML表單元素 input輸入型別(2)

在html中,表單元素中的input元素是佔很重要的地位的,第一原因是常用,第二是input元素有太多的type值。老的在之前的文章 input輸入型別 1 中有講解 這裡主壓迫詳細介紹html5中新增的 html5 增加了多個新的type color 用於應該包含顏色的輸入字段。date 用於應該...

2023年2月9日 實習日記

今天在將在ubuntu上配置的環境在rhel上重新進行配置,並找出其中存在的問題。說實話這也是我第一次接觸rhel。首先做乙個啟動盤 工具ultraiso iso兩個 get from intel rhel 7.3 20161019.0 server x86 64 boot.iso rhel 7.3...