nacycul
Posts: 1
Joined: Mon Sep 13, 2021 1:18 am

css with Geany

Mon Sep 13, 2021 3:15 am

I have the raspberri pi 4 keyboard. I am totally new to linux. I have been using Geany to practice HTML. I have been doing this little tutorial and i can not get the html file to link with the css file. I am not sure if I have to download something for Geany or if my code is just not right. Because, I have been using it for java and javascript tutorials also and I had to download and update some things. Is it the same for css? Do I have to edit the build commands maybe. I have been googling the issue , but, i can not find an answer. I am pretty sure it is something simple. Please help.

below is my html code first then the css

Code: Select all

[code]<!DOCTYPE html>
<html>
  <head>
    <title>Brown Bears</title>
  
    <link href="./style.css" rel="./stylesheet"/>
  </head>
  <body>
    <nav>
      <a href="./test.html">Test</a>
      <a href="./style.css">About Me</a>
    </nav>
    <h1>The Brown Bear</h1>
    <nav>
      <ul>
        <li><a href="#introduction">Introduction</a></li>
        <li><a href="#habitat">Habitat</a></li>
        <li><a href="#Media">Media</a></li>
      </ul>
    </nav>  
    <div id="introduction">
      <h2>About Brown Bears</h2>
      <p>The brown bear(<em>Ursus arctos</em>) is native to parts of northern Eurasia and North America. It's conservation status is currently <strong>Least Concern</strong>.<br><br>There are many subspecies within the brown bear species including the Atlas bear and the Himilayan brown bear.</p>
      <a href="https://en.wikipedia.org/wiki/Brown_bear" target="_blank">Learn More</a>
      <h3>Species</h3>
      <ul>
        <li>Arctos</li>
        <li>Collarus</li>
        <li>Horribillis</li>
        <li>Nelsoni (extinct)</li>
      </ul> 
      <h3>Features</h3>
      <p>Brown bears are not always completely brown. Some can be reddish or yellowish. They have very large, curved claws and paws. Male brown bears are often 30% larger than female brown bears. They can range from 5 to 9 feet from head to toe.</p>
    </div>
    <div id="habitat">
      <h2>Habitat</h2>
      <h3>Countries with Large Brown Bear Populations</h3>
      <ol>
        <li>Russia</li>
        <li>United States</li>
        <li>Canada</li>
      </ol>
       <h3>Countrie with Small Brown Bear Populations</h3>
       <p>Some countries with smaller brown bear populations include: Armeniea, Belarus, Bulgaria, China, Finland, France, Greece, India, Japan, Poland, Romania, Slovenia, Turkmenistan, and Uzbekistan.</p> 
    </div>
    <div id="media">
      <h2>Media</h2>
      <!-- every <img> needs an alt atribute-->
      <img alt="" src="https://content.codecademy.com/courses/web101-image_brownbear.jpg"/>
      <video src="https://content.codecademy.com/courses/freelance-1/unit-1/lesson-2/htmlcss1-vid_brown-bear.mp4" height="240" width="320" controls>Video not supported</video>
    </div>      
  </body>
</html>

Code: Select all

page{
	p{
		color: green;
	}
}

User avatar
Gavinmc42
Posts: 6059
Joined: Wed Aug 28, 2013 3:31 am

Re: css with Geany

Tue Sep 14, 2021 2:37 am

Code: Select all

href="./style.css"
Probably a path name issue.
Might need to put the full path name in below the index.html folder.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

Heater
Posts: 18514
Joined: Tue Jul 17, 2012 3:02 pm

Re: css with Geany

Tue Sep 14, 2021 4:16 pm

How are you viewing those files? In a browser from files served up by a web server, Apache or whatever? Or in a browser opening local files?

Either way I'm sure you have path problem. I suspect the "./" is not required.

You should not be using full file paths. As in /home/me/myproject/style.css. Rather you should give the path relative to the path of the HTML file.
Memory in C++ is a leaky abstraction .

Return to “General programming discussion”