CSS中設置圖片的寬度和高度

原創 fmup20115412 2018-08-24 19:57
  1. <!DOCTYPE html> 
  2. <html> 
  3. <head> 
  4. <meta charset="utf-8" /> 
  5. <title>css控制圖片大小在線演示 www.divcss5.com</title> 
  6. <style> 
  7. .divcss5 img{ width:300px; height:100px} 
  8. </style> 
  9. </head> 
  10.  
  11. <body> 
  12. <p><strong>原始圖片大小</strong></p> 
  13. <p><img src="divcss5-logo-201305.gif"><br> 
  14. 本身這個圖片寬度爲165px高度60px</p> 
  15. <p><strong>通過CSS改變設置圖片大小</strong></p> 
  16. <div  class="divcss5"> 
  17.     <img src="divcss5-logo-201305.gif"><br> 
  18.     這裏設置divcss5盒子裏圖片寬度300px高度100px 
  19. </div> 
  20. </body> 
  21. </html> 
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

【Echarts+Html+LayUI】同一htlm頁面，點擊不同選項，加載不同echart

遇到的坑： 問題1 加載一個之後，再點擊另一個，可能是某個模板設定的問題，導致出現重疊的情況。 問題1解決方法： // 基於準備好的dom，初始化echarts實例 var div_main = document.getEle

33 Audrey 2020-07-08 12:35:22

html+css 選項卡

  <style type=text/css>td {   font-size: 12px;  color: #000000;  line-heig

bluelazyboy 2020-07-08 12:23:28

html-base

placeholder value 1.placeholder要寫在value前面,防止php中空字符變量影響. checked 1.checked是checked="checked"的縮寫; pre 1.可定義預格式化的文本,在pre元

liangfrank 2020-07-08 12:23:03

B2ContextMenu附件系統菜單插件

2005年1月22日19:55星期六  [B2PlugIn] B2ContextMenu for becky! Windows 9x/ME/NT/2K/XPCopyright (C) 1994-2005 yippee_skyippee_

yippeesk 2020-07-08 12:22:24

Html學習之標籤

html 中<a>用於實現鏈接到另一個頁面，常用屬性是： href：目標網址 在href中可以使用mailto在網頁中鏈接Email地址 title：鼠標滑過時顯示的文本 title屬性的作用，鼠標滑過鏈接文字時會顯示這個屬性的文本內

qq_33044181 2020-07-08 11:59:34

不知道取個啥名（CSS翻轉，transform）

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-

ddx2019 2020-07-08 11:55:42

原生JS實現樹狀結構列表

樹狀結構列表，這個技術點之前有寫過了，是基於vue講解，但似乎都沒有解決痛點，最基礎的原生JS該怎麼實現呢？ 這篇文章會全面詳細的介紹樹狀結構列表的實現，從數據處理成樹狀結構，到動態生成dom節點渲染頁面。  確定原始數據結構  原始數據

wendZzz 2020-07-08 11:27:37

a標籤中使用onclick提示function未定義

<a href="javascript:;" onclick="text()">leave a message</a> 今天做東西的時候，發現在a標籤中使用onclick觸發函數，一直報錯，顯示function未定義，開始還以爲

Ro0k1e 2020-07-08 11:27:27

html格式化輸出

文本格式化 多個空行會被瀏覽器忽略 <b>This text is bold</b>加粗 <br /> <strong>This text is strong</strong> <br /> <big>This text

zgqxiexie 2020-07-08 11:05:52

JS基礎複習（四）四分鐘帶你徹底搞定全局變量和局部變量

JS基礎複習（四）四分鐘帶你徹底搞定全局變量和局部變量 一、寫在開頭 這個是因爲最近期末考要考web，恰好有這個知識點，所以我自己總結了一下，希望可以幫助到大家。 二、發現問題 區分什麼是局部變量，什麼是全局變量，變量之間賦值後結

ODST_TheSolverO5 2020-07-08 10:59:41

HTML5入門之常用標籤

html5標準網頁聲明 <!DOCTYPE html> 必要結構 <html > <head> <meta charset="UTF-8"> <title>Title</title> </head> <body>

blackcatkiller 2020-07-08 10:51:12

web前端複習第七課

                                           二級導航實例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti

思丰百年 2020-07-08 10:46:31

首次體驗phonegap實現的Android APP

之前就聽說過phonegap的存在，但是就是一直沒有時間去接觸它，對他很迷糊。然後最近一時興起，就去百度了一下phonegap是什麼？ 以下是百度百科的解釋： PhoneGap是一個用基於HTML，CSS和JavaScript的

LFWMP 2020-07-08 10:28:30

網頁設計中常見的兼容性問題

常見兼容性問題 1、png24位的圖片在iE6瀏覽器上出現背景，解決方案是做成PNG8. 2、瀏覽器默認的margin和padding不同。解決方案是加一個全局的 *{margin:0;padding:0;}來統一。 3、IE6

LFWMP 2020-07-08 10:28:29

嚴格模式與混雜模式

如何區分嚴格模式與混雜模式，它們有何意義！ 嚴格模式：又稱標準模式，是指瀏覽器按照 W3C 標準解析代碼。 混雜模式：又稱怪異模式或兼容模式，是指瀏覽器用自己的方式解析代碼。 區分方法： 如果文檔包含嚴格的 DOCTYPE ，那

LFWMP 2020-07-08 10:28:29