![thumbnail]( "thumbnail")
本文介绍了我的CSS不会与我的HTML链接？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 < ！DOCTYPE html > < meta name = msapplication-TileColor 内容 = ＃da532c > < meta name = theme-color content = #ffffff > < meta charset = utf-8 > < title > ottergram < h1 class = logo-text > ottergram < / h1 > < ul class = thumbnail-list > < li class = thumbnail-item > < a href = ＃ > < span class = thumbnail-title > Barry < / span > < / a > < / li > < li class = thumbnail-item > < a href = ＃ > < span class = thumbnail-title > Robin < / span > < / a > < / li > < li class = thumbnail-item > < a href = ＃ > < span class = thumbnail-title > Maurice < / span > < / a > < / li > < li class = thumbnail-item > < a href = ＃ > < span class = thumbnail-title > Lesley < / span > < / a > < / li > < li class = thumbnail-item > < ; a href = ＃ > < span class = thumbnail- title > Barbara < / span > < / a > < / li > < / ul > body { background：rgb（149,194,215）; 字体大小：10px; } a { text-decoration：none; } thumbnail-item + .thumbnail-item { margin-top：10px;} .thumbnail-item { 边界：1px solid rgb（100％，100％，100％）; border：1px solid rgba（100％，100％，100％，0.8）; display：block; } .thumbnail-list { display：block; list-style：none; 宽度：100％; } .thumbnail-title { background：rgb（96,125,139）; color：rgb（202,238,139）; display：block; 字体大小：18px; 保证金：0; 填充：4px 10px; } 我的尝试： 我的html与我的css在同一个文件夹中，不知道为什么它没有链接。解决方案 <！DOCTYPE html> < html lang =endir =ltr> < head> < link rel =stylesheethref =styles.css> < link rel =apple-touch-iconsizes =180x180href =/ apple-touch-icon.png> < link rel =icontype =image / pngsizes =32x32href =/ favicon-32x32.png> < link rel =icontype =image / pngsizes =16x16href =/ favicon-16x16.png> < link rel =manifesthref =/ site.webmanifest> < link rel =mask-iconhref =/ safari-pinned-tab.svgcolor =＃5bbad5> < meta name =msapplication-TileColorcontent =＃da532c> < meta name =theme-colorcontent =#ffffff> < meta charset =utf-8> < title> ottergram< / title> < / head> < body> < header> < h1 class =logo-text> ottergram< / h1> < / header> < ul class =thumbnail-list> < li class =thumbnail-item> < a href =＃> < img class =thmbnail-imagesrc =img / otter1.jpgalt =Barry the otter> < span class =thumbnail-title> Barry< / span> < / a> < / li> < li class =thumbnail-item> < a href =＃> < img class =thumbnail-imagesrc =img / otter2.jpgalt =Robin the otter> < span class =thumbnail-title>罗宾< /跨度> < / a> < / li> < li class =thumbnail-item> < a href =＃> < img class =thumbnail-imagesrc =img / otter3.jpgalt =Maurice the otter> < span class =thumbnail-title> Maurice< / span> < / a> < / li> < li class =thumbnail-item> < a href =＃> < img class =thmbnail-imagesrc =img / otter4.jpgalt =Lesley the otter> < span class =thumbnail-title> Lesley< / span> < / a> < / li> < li class =thumbnail-item> < a href =＃> < img class =thumbnail-imagesrc =img / otter5.jpgalt =Barbara the otter> < span class =thumbnail-title> Barbara< / span> < / a> < / li> < / ul> < / body> < / html> <!DOCTYPE html> <meta name="msapplication-TileColor" content="#da532c"> <meta name="theme-color" content="#ffffff"> <meta charset="utf-8"> <title>ottergram <h1 class="logo-text">ottergram</h1> <ul class="thumbnail-list"> <li class="thumbnail-item"> <a href="#"> <span class="thumbnail-title">Barry</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <span class="thumbnail-title"> Robin</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <span class="thumbnail-title">Maurice</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <span class="thumbnail-title">Lesley</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <span class="thumbnail-title">Barbara</span> </a> </li> </ul>body { background: rgb(149, 194, 215); font-size: 10px;}a { text-decoration: none;}thumbnail-item + .thumbnail-item { margin-top: 10px;}.thumbnail-item { border: 1px solid rgb(100%, 100%, 100%); border: 1px solid rgba(100%, 100%, 100%, 0.8); display: block;}.thumbnail-list { display: block; list-style: none; width: 100%;}.thumbnail-title { background: rgb(96, 125, 139); color: rgb(202, 238, 139); display: block; font-size: 18px; margin: 0; padding: 4px 10px;}What I have tried:My html is in the same folder as my css, dont know why it isnt linking. 解决方案 <!DOCTYPE html><html lang="en" dir="ltr"><head> <link rel="stylesheet" href="styles.css"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="manifest" href="/site.webmanifest"> <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="theme-color" content="#ffffff"> <meta charset="utf-8"> <title>ottergram</title></head><body> <header> <h1 class="logo-text">ottergram</h1> </header> <ul class="thumbnail-list"> <li class="thumbnail-item"> <a href="#"> <img class="thmbnail-image" src="img/otter1.jpg" alt="Barry the otter"> <span class ="thumbnail-title">Barry</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <img class="thumbnail-image" src="img/otter2.jpg" alt="Robin the otter"> <span class ="thumbnail-title"> Robin</span> </a> </li> <li class="thumbnail-item" > <a href="#"> <img class="thumbnail-image" src="img/otter3.jpg" alt="Maurice the otter"> <span class ="thumbnail-title" >Maurice</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <img class="thmbnail-image" src="img/otter4.jpg" alt="Lesley the otter"> <span class="thumbnail-title" >Lesley</span> </a> </li> <li class="thumbnail-item"> <a href="#"> <img class="thumbnail-image" src="img/otter5.jpg" alt="Barbara the otter"> <span class="thumbnail-title">Barbara</span> </a> </li> </ul></body></html> 这篇关于我的CSS不会与我的HTML链接？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 09-22 02:41