Core MVC - Adjusting Font Size

After setting up an MVC Core App with automatic scaffolding, I am now faced with the challenge of adjusting the font size in my html View. The question is: How can I change the font size in bootstrap.css? There seem to be multiple font sizes available and I'm not quite sure where to begin looking for the right one. Interestingly, I couldn't find a class called "form-actions" in bootstrap.css

<p>
    <a asp-action="Create">Create New</a> </p>

<form asp-action="Index" method="get">
    <div class="form-actions no-color">
        <p>
            <b>Find by Brand:</b> <input type="text" name="ParamBrand" value="@ViewData["currentBrand"]" />
            <br />
            <b>Find by Color:</b> <input type="text" name="ParamColor" value="@ViewData["currentColor"]" />
            <br />
            <b>Find by Weight:</b> <input type="text" name="ParamWeight" value="@ViewData["currentWeight"]" />
            <input type="submit" value="Search" class="btn btn-default" /> |
            <a asp-action="Index">Back to Full List</a>
        </p>
    </div>

Answer №1

If you're wondering about the order in which CSS files are loaded, take a look at your _layout.cshtml. It will show you exactly how they are being loaded.

It should look something like this:

<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" />

This means that site.css is loading after bootstrap. Any custom styles or overrides can be placed in site.css to override the bootstrap rules:

.no-color {
   font-size: 48px;
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to prioritize List Items over menu items in the front?

Sorry if the title is unclear, let me clarify with some images. First, here is how the navigation bar looks in full window view: Now, this is what happens when I decrease the screen resolution: The items list seems to be hiding behind the menu items. Ho ...

Regular expression for capturing multi-line HTML comments using preg_match_all

I am dealing with an HTML document that contains several commented-out PHP arrays, such as: <!-- Array ( [key] => 0 ) --> My goal is to extract the contents of only these specific comments using PHP. I have attempted to achieve this by using pre ...

Using iScroll without animation by using scrolltoelement on an iPhone PhoneGap application

I've been working on an iOS PhoneGap app that uses Backbone and some other libraries. To handle scrolling, I implemented iScroll which has been functioning properly. However, I encountered a problem with the following code snippet: events: { &apo ...

Using PHP to redirect upon clicking a link

My issue involves directing users to another page or form and saving the button they click as a value when selecting a CRN (course number). <table class="table table-bordered table-hover table-striped"> <thead> ...

Having trouble uploading an image to firebase storage as I continuously encounter the error message: Unable to access property 'name' of undefined

Hey there, I'm currently facing an issue while trying to upload an image to Firebase storage. Despite following all the instructions on the official Firebase site, I'm stuck trying to resolve this error: Uncaught TypeError: Cannot read property ...

What is the best way to incorporate a <li> view cap within a div element using JavaScript?

Currently, I am attempting to implement a dynamic <li> view limit within the content of a div. My goal is to display only 3 <li> elements each time the div content is scrolled. Although not confirmed, I believe this example may be helpful: ...

Show where the image should be placed according to the coordinates of the mouse click

My project begins with a blank canvas, prompting the user to click anywhere on the page to reveal an image. My goal is to show an image at the exact location where the user clicks. Although I can successfully trigger an image to appear in the corner of the ...

Can you explain why there is a discrepancy in the canvas coloration?

When I try to draw a line on my canvas with color "#ca5100", the actual color that appears is "#e4a77f". Why does this difference occur and how can I ensure that the correct color is set? var ctx = document.getElementById("mycanva").getContext("2d"); ct ...

Instructions on integrating a column of buttons into a Bootstrap table containing information retrieved from a MySQL database

My bootstrap table is currently displaying data that is loaded from a MySQL database. I am looking to enhance it by adding a column with buttons, similar to the layout shown in this image. https://i.stack.imgur.com/8fWfR.png However, I am facing some dif ...

Trigger the phone to vibrate once the animation has completed. This feature will only activate upon clicking the button

After the image completes its animation by sliding in from the left, I would like it to vibrate for 2 seconds using the HTML 5 vibrate API: navigator.vibrate(2000); An on-click event successfully triggers the vibration when a button is clicked: <butt ...

New data row successfully added to HTML table, revealing an object display

When I click a button, a dialog box opens up. I can fill out the form inside the dialog box and submit it to insert a row into a table. After submitting the form, the newly inserted row displays as [object Object] immediately after submission: It seems t ...

Incorporating an additional row into a material table

Currently, I have implemented a mat-table with various features including drag and drop functionality and dynamic columns. However, I am facing an issue while trying to add row filters under the table header. I attempted to simply insert a <mat-row> ...

Creating a interactive chat interface in WPF with text that can be easily selected

Creating an interactive chat view with selectable text in WPF I have a project where I need to develop a basic text chat application using WPF. The key requirement is that users should be able to select and copy text easily. I have considered using a List ...

Unable to Change Navbar Color

Presented here is the code snippet for the navbar located in app/assets/views/elements: <nav class="navbar navbar-default" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> ...

Decoding JSON data using C# in a .NET Core environment

Having issues deserializing JSON data received via POST. The error message reads: SerializationException: Expecting state 'Element'.. Encountered 'Text' with name '', namespace ''. System.Runtime.Serialization. ...

Uploading images in PHP

I need assistance with uploading an image to a server using PHP, saving it inside a directory, and then retrieving the image URL. Here is my HTML code: <form method="post> <fieldset> <div class="form-group col-md-6 col-lg-6 col-sm-1 ...

What is the proper way to apply a background color to the entire body using CSS?

I'm facing an issue with getting the background color to cover the entire body of my webpage. Currently, it only captures a certain size and when there is scrolling on the window, two shades of colors appear. I want the background color to span the en ...

The CSS does not display properly on iPad or mobile devices

Recently, I had the opportunity to design a website for a local music school. This project was a great learning experience that has shown me the importance of continuous improvement and practice. Check out the site here Initially, I wanted to make the w ...

Receiving Json data from ASP.NET CORE 2.1 using JsonResult

Code snippet for a ASP.NET Core 2.0 controller: [Produces("application/json")] [Route("api/[controller]")] [ApiController] public class GraficResourcesApiController : ControllerBase { private readonly ApplicationDbContext _context; public Gra ...

How to customize font styles in AngularJS

I'm attempting to modify the font style of an element when a certain variable is true. Within my controller, I have a variable that retrieves its value. My objective is to adjust the font style depending on this value using ng-style. I've exhau ...