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

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 综合教程 >内容正文

综合教程

div标签内常用属性有哪些

發布時間:2023/12/19 综合教程 29 生活家
生活随笔 收集整理的這篇文章主要介紹了 div标签内常用属性有哪些 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

這篇文章主要介紹了div標簽內常用屬性有哪些,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

div標簽內常用屬性列表

  • 1、style 設置css樣式(擴展了解style標簽)

  • 2、align 設置div盒子內的內容居中、居左、居右

  • 3、id 引人外部對應#(井號)選擇符號樣式

  • 4、class 引人外部對應.(句號)選擇符號樣式

  • 5、title 設置div(標題)鼠標經過時顯示文字(擴展了解 title標簽)

接下來DIVCSS5為大家逐個介紹DIV屬性,通過HTML基礎語法結構、CSS語法基礎結構,再到通過實例圖文方式介紹以上五點div 屬性。

一、div style屬性 - TOP

在div標簽內可以直接使用style屬性,此屬性可以直接設置CSS樣式,也叫標簽內樣式,同理span、h2、h3、strong、p等標簽都可以直接使用style屬性來設置CSS樣式。

1、我們見過語法示范

<divstyle="color:#F00;font-size:18px">字體大小18px,字體顏色為紅色</div>

這里就是直接div使用style設置CSS樣式

2、style設置css效果截圖


div內設置style屬性CSS樣式案例效果截圖

3、div屬性之style總結
對div標簽內使用style作用是直接對div標簽設置CSS樣式,所以要想div直接標簽內使用樣式表,那直接對div使用style屬性設置樣式即可。

二、div align屬性 - TOP

直接對標簽內加align屬性,作用是讓對象內的內容居左、居中、居右效果。

1、對div設置align屬性實例代碼如下

<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title>div的屬性演示</title></head><body><divalign="left">居左</div><divalign="center">居中</div><divalign="right">居右</div></body></html>

2、教程案例截圖


對div設置align屬性實現內容居中 居左 居右

3、相關CSS樣式
1)、css 居中、CSS居左、css居右是什么樣式單詞實現。
2)、html div align教程

三、div id屬性 - TOP

在div標簽內使用id,一方面如果是JS特效可能是動作腳本類識別功能,另外一方面在CSS中以#號命名的樣式選擇器樣式。當然其它標簽均可以設置id屬性。

1、id使用實例代碼

<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title>div的屬性演示</title><style>#億速云{color:#F00;font-size:16px;font-weight:bold}</style></head><body><divid="億速云">字體為紅色,字體16px,加粗</div></body></html>

2、div id實例截圖


在div中使用id截圖

四、div class屬性 - TOP

class和id語法結構用法均相同,通常設置對象樣式使用,通在css中以“.”英文半角小寫句號開頭命名的樣式選擇器,在div或其他標簽使用class應用。

1、實例完整html源代碼

<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title>div的屬性演示</title><style>.億速云{color:#00F;font-size:18px}</style></head><body><divclass="億速云">字體為藍色,字體18px</div></body></html>

2、class div實例效果截圖


div class屬性實例截圖

五、對div設置title屬性 - TOP

對div或其它標簽設置title屬性,作用是當鼠標經過懸停與div或改對象時候顯示提示內容,就像對a標簽設置title屬性相同道理(了解 網頁中title標題)。

1、div+css實例代碼

<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title>div的屬性演示</title></head><body><divtitle="鼠標懸停時我顯示">DIVCSS5內容</div></body></html>

2、實例效果瀏覽器截圖


對div設置title,鼠標經過懸停在div對象上時效果截圖

當鼠標經過懸停與設置title屬性的div盒子上時,鼠標旁邊提示顯示title設置的內容信息。此使用方法與html a超鏈接設置title屬性相同。

總結

以上是生活随笔為你收集整理的div标签内常用属性有哪些的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。